我有一组div对(‘header’和’body’).当用户点击标题时,下一个正文部分应显示/隐藏(并更新/ – 图标).所有div都写在页面加载中“显示”但我想“关闭”它们中的一些,如果用户愿意,用户可以打开它们.只是不能让它工作!如果有人可以提供帮助,代码如下!
样品部分:
<div class="expandingSection_head" id="expanderAI"> <img class="imgExpand" src="../images/treeExpand_plus.gif" /> Header text here </div> <div class="expandingSection_body"> body text here </div> ...more pairs of divs like this on rest of page...
要切换的代码:
$(".expandingSection_head").toggle( function() { $(this).css('background-color','#6BA284'); $(this).find('.imgExpand').attr('src','../images/treeExpand_plus.gif'); $(this).next(".expandingSection_body").slideUp(400); },function() { $(this).css('background-color','../images/treeExpand_minus.gif'); $(this).next(".expandingSection_body").slideDown(400); }); $("#expanderAI").toggle();
最后一行不“切换”指定的div(即“关闭”它).谁知道为什么?可能很简单.
谢谢!
解决方法
它不会仅仅通过指定:
$("#expanderAI").toggle();
它背后应该有一些事件,例如:
$('element').click(function(){ $("#expanderAI").toggle(); });
更新:
试试这个:
$('#expanderAI').click(function(){ $(this).toggle(); });