我在一个页面上有几个 div。每个 div 都有一个标题，我可以单击该标题来切换相应 div 的可见性。 div 设置为display:none默认情况下。
我用过#ids在每个 div 的点击功能中，但是因为我在同一页面上有多个 div 。我想使用一个.class这样我就有一个类，从而有一个控制可见性的函数。
我猜我需要使用.parent and .sibling类来执行此操作。
以下是我的代码的摘录：
HTML：
<div>
<legend>
<a id="show_table" class="show_table" href="#">
<span id="plus_minus"></span>Div
</a>
</legend>
<div class="toshow" id="toshow">Div to be shown</div>
</div>
JS:
$('#show_table').click(function(){
$("#toshow").slideToggle();
})
我想提高效率，这样我就不必使用#id我想知道如何使用单个.class，可能是它的父母和兄弟姐妹来做这个。
另外，我想在上面有一个减号/加号切换功能plus_minus跨度。我使用个人进行了相同的工作ids。我如何能够使用单个来实现这一目标.class。我尝试使用以下方法：
$('.div_show').click( function(){
$(this).parent().next().slideToggle();
if($(this).parent().next().is(':visible'){
$(this).closest('span').find('plus_minus').text('+');
}
else {
$(this).closest('span').find('plus_minus').text('-');
}
});
然而它似乎不起作用。
关于如何实现此 +/- 切换功能的建议值得赞赏。
为什么不试试这个
$('.show_table').click(function(){
$(this).parent().next().slideToggle();
})
更新的代码
因为您使用的是 SlideToggle，所以对 DOM 的更改不会轻易更新。所以您必须处理它的回调函数中的可见性问题。
试试这个代码
$('.show_table').click(function(){
var $elem = $(this);
$(this).parent().next().slideToggle('slow', function() {
if($(this).is(':visible')){
$elem.find('span').html('+');
}
else{
$elem.find('span').html('-');
}
});
})
更新的小提琴 http://jsfiddle.net/sushanth009/5SCnf/12/
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
