Я застрял в проблеме с выпадающим div из моего php echo while loop.
Я пытаюсь переключать свои скрытые div с помощью jquery, но проблема в том, что .next () не получает скрытого врага в каждом цикле.
Я знаю, как переключать, прятать и делать какие-то другие вещи с помощью jquery, но я хорош только тогда, когда divs особенные или их всего несколько.
Я экспериментировал с (следующим) jquery-кодом, и он работал только для простых div-ов (один рядом с другим) ... Но у отраженных div-ов есть некоторые дочерние div-ы внутри других, так что (следующий) не получает мой скрытый div и я ничего не получаю!
Я нашел решение с помощью простого javascript и запуска события onClick, но я хочу изменить его обратно на jquery, чтобы я мог добавить к нему эффект .slideToggle («slow»).
Я попытался получить атрибуты с помощью .attr (OnClick) и затем использовать его для переключения целевого div, который является скрытым, но этого просто не происходит ... !!!
Я спрашиваю, может ли кто-нибудь дать мне постоянное решение для множественных делений на странице ...
и вместо двух кнопок скрыть / показать, чтобы изменить его обратно на одну кнопку.
К вашему сведению:
1 идентификаторы дочерних элементов различны для каждого цикла, который я повторяю, так что jquery может обрабатывать желаемый div
2. У меня нет проблем в части PHP ...
3. Я искал много мест, но единственное решение, которое я нашел, было .next ()
А вот простой код в javascript, над которым я экспериментирую:
В коде есть 2 повторяющихся цикла, так что вы знаете о том, как он есть, и тому подобное, потому что я использовал его только в блокноте и быстро его стилизовал. Вы можете вставить его в блокнот и понять, что я имею в виду. Обычно у меня должно быть 10 циклов. ,
Большое спасибо :-) Хорошего дня!
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.`enter code here`/jquery.min.js"></script>
<script type="text/javascript">
function showHideContent(id, show)
{
var elem = document.getElementById(id);
if (elem)
{
if (show)
{
elem.style.display = 'block';
elem.style.visibility = 'visible';
}
else
{
elem.style.display = 'none';
elem.style.visibility = 'hidden';
}
}
}
</script></head><body>
<div id='blockinfo'style="border:1px solid black; width:500px">
<div style='float:left;border:1px solid black;'width='70px'>Some Image</div>
<span>some info</span><br>
<div class='blockinfo1' style=' margin-top:-10px;'>
<button style='border:1px solid black; letter-spacing:1px; margin-left:100px;''
onclick="showHideContent('hiddendiv1', false);">hide
</button>
<button style='border:1px solid black; letter-spacing:1px; margin-left:100px;'
onclick="showHideContent('hiddendiv1', true);">show
</button>
</div>
<br>
<div id='hiddendiv1'style='background-color:black; display:none; width:500px; height:200px;'>
<h1 style="color:white;"> more info </h1></div>
<div id='blockinfo'style="border:1px solid black; width:500px">
<div style='float:left;border:1px solid black;'width='70px'>Some Image</div>
<span>some info</span><br>
<div class='blockinfo2' style=' margin-top:-10px;'>
<button style='border:1px solid black; letter-spacing:1px; margin-left:100px;''
onclick="showHideContent('hiddendiv2', false);">hide
</button>
<button style='border:1px solid black; letter-spacing:1px; margin-left:100px;'
onclick="showHideContent('hiddendiv2', true);">show
</button>
</div>
<br>
<div id='hiddendiv2'style='background-color:black; display:none; width:500px; height:200px;'>
<h1 style="color:white;"> more info </h1>
</div>
</body><html>