我需要修复这个小代码:
jQuery(document).ready(function() {
$('.plus').click(function(){
$('#top:hidden').show('slow');
$('.plus').click(function(){
$('#top:visible').hide('slow');
});
});
});
试试这个:
jQuery(document).ready(function() {
$('.plus').click(function(){
$('#top').toggle('slow');
});
});
也就是说,每次'.plus'
点击元素时,'#top'
元素都会在可见和不可见之间切换。
问题中显示的代码表示,'.plus'
单击时,使其'#top'
可见(如果当前不可见),然后分配第二个单击处理程序,该处理程序将使'#top'
不可见。在下一次单击时,这两个处理程序都将运行,创建第三个处理程序。在下一次单击时,所有三个处理程序都会运行。等等。也就是说,重复调用以.click()
添加其他处理程序,它们不会替换以前的处理程序。
您不需要绑定两次单击,而是可以设置条件显示和隐藏。
$('.plus').click(function(){
if($('#top').is(':visible')
$('#top').hide('slow');
else
$('#top').show('slow');
});
你也可以使用togle事件
$('.plus').toggle(function(){
$('#top').show('slow');
},
function(){
$('#top').hide('slow');
});
您可以使用toggle()
来替换hide()
和show()
$('.plus').click(function(){
$('#top').toggle('slow');
})