Переключить, какой бы элемент ни был нажат
Я использую toggle () с jQuery, и у меня есть боковая панель на моей странице, и каждый заголовок
<h2 class = "sidebar-header">
Один раздел моего кода будет выглядеть так:
<div class = "sidebar-section">
<h2 class = "sidebar-header">SUBSCRIBE</h2>
<p class = "sidebar">Make sure you subscribe to stay in touch with the latest articles and tutorials. Click on one of the images below:</p>
<div class = "rss-icons">
<a href = "http://fusion.google.com/add?feedurl=http://feeds.feedburner.com/ryancoughlin"><img src = "http://gmodules.com/ig/images/plus_google.gif" width = "62" height = "17" alt = "Add to Google Reader or Homepage" class = "feed-image"/></a>
<a href = "http://add.my.yahoo.com/rss?url=http://feeds.feedburner.com/ryancoughlin" title = "Web/Graphic Design/Development by Ryan Coughlin"><img src = "http://us.i1.yimg.com/us.yimg.com/i/us/my/addtomyyahoo3.gif" alt = "Add feed to My Yahoo" width = "62" height = "17" class = "feed-image" /></a>
<a href = "http://www.newsgator.com/ngs/subscriber/subext.aspx?url=http://feeds.feedburner.com/ryancoughlin" title = "Web/Graphic Design/Development by Ryan Coughlin"><img src = "http://www.newsgator.com/images/ngsub1.gif" alt = "Subscribe in NewsGator Online" class = "feed-image" height = "17" /></a>
</div>
<hr />
<p class = "sidebar feed">Don't have those? Grab the <a href = "http://feeds.feedburner.com/ryancoughlin" target = "_blank" title = "Subscribe to this feed">RSS</a> url.</p>
<p class = "sidebar delicious">Make sure you add me to <a href = "http://del.icio.us/post?url=http://www.ryancoughlin.com&title=Ryan Coughlin - Web/Graphic Design and Development" target = "_blank" title = "Add to delicious!">delicious!</a> </p>
</div>
Каждый из них заключен в эти элементы DIV. Я пытаюсь сделать это, потому что если вы нажмете на заголовок, он сократит содержимое. Я знаю, что переключатель может это сделать, но если я сделаю это для каждого «заголовка боковой панели», вы нажмете любой элемент на странице, и он скроет их все, как я могу это сделать?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Попробуйте что-то вроде этого:
Предположим, у вас есть следующий код:
<div class = "topdiv">
<h2 class = "header">Header 1</h2>
<div class = "somecontent">
This is the content
</div>
</div>
<div class = "topdiv">
<h2 class = "header">Header 2</h2>
<div class = "somecontent">
This is the content
</div>
</div>
Теперь предположим, что когда вы хотите щелкнуть заголовок, содержимое этого заголовка отображается / скрывается:
$(".header").click(function () {
$(this).parent(".topdiv:first").find(".somecontent").toggle();
});
Таким образом, будет переключаться только содержимое конкретного заголовка, а не все остальное.
Теперь вы можете проанализировать код, который я написал для вас, и применить его в своем собственном контексте.
Да, он найдет выбранный заголовок, перейдет к его родительскому div с классом topdiv, затем перейдет к дочернему элементу этого topdiv с классом somecontent и переключит его.
Попробуй это: nextAll
$(".sidebar-header").click(function() {
$(this).nextAll().toggle();
});
Казалось, это сработало! Интересно, как работает nextAll (), я все еще не понимаю, как это работает, все братья и сестры? Я знаю, что это отчасти "широко", но что именно "означает" Спасибо, Макс
Внутренне jQuery использует свойство элемента DOM "nextSibling", когда вы вызываете "nextAll". И есть простой цикл «пока» для сканирования всех братьев и сестер после текущего элемента. Вы даже можете изучить его самостоятельно в источниках jQuery: найдите «nextAll», а затем посмотрите на соответствующий вызов «dir» :)
Итак, это сработает, когда вы нажмете .header, он возьмет этот элемент и родительский элемент div.topdiv и найдет .somecontent, а затем применит переключатель? Верный? Спасибо за вашу помощь! Райан