jQuery的手风琴1.3.2不工作(是工作在1.3!)
-
19-09-2019 - |
题
好了,什么地方,什么是错的。当我使用1.3版本的手风琴是工作的罚款。当我升级了jQuery 1.3.2版本,现在它不再有效,因为它是应该。我需要最新版本,因为它是解决一些错误IE6被扔了......
因此,这里的代码,有什么需要,以改变它与jQuery的最新vesion工作?
$(function() {
$(".accordion h4").eq(2).addClass("active");
$(".accordion div").eq(2).show();
$(".accordion h4").click(function(){
$(this).next(".accordion div").slideToggle("slow")
.siblings("div:visible").slideUp("slow");
$(this).toggleClass("active");
$(this).siblings("h4").removeClass("active");
});
$("div.accordion div").hide();
$("h4#open").trigger('click');
});
HTML推移类似:
<div class="accordion">
<h4 id="open">Content header</h4>
<div>
<ul>
<li><strong>Something</strong> <em>Else</em></li>
<li><strong>Something</strong> <em>Else</em></li>
<li><strong>Something</strong> <em>Else</em></li>
<li><strong>Something</strong> <em>Else</em></li>
</ul>
</div>
<h4>Content header</h4>
<div>
<ul>
<li><strong>Something</strong> <em>Else</em></li>
<li><strong>Something</strong> <em>Else</em></li>
<li><strong>Something</strong> <em>Else</em></li>
<li><strong>Something</strong> <em>Else</em></li>
</ul>
</div>
<h4>Content header</h4>
<div>
<ul>
<li><strong>Something</strong> <em>Else</em></li>
<li><strong>Something</strong> <em>Else</em></li>
<li><strong>Something</strong> <em>Else</em></li>
<li><strong>Something</strong> <em>Else</em></li>
</ul>
</div>
我要注意,它不工作,是扩大第二面板时,第一小组应崩溃正常 - 但它1.3.2是不是这样...
*我已经更新了什么我真的有事情,因为它似乎是HTML / CSS,这是给问题的HTML。
我的CSS设置为:
li strong{display:block;float:left;width:250px;background:#ccc;}
li em{display:block;float:left;width:700px;background:#ddd;}
,以便它以得到一个“2列的表格状”效应(以及便于客户-CMS编辑 - 命中“黑体”按钮,然后按下“i”按钮) - 但它似乎是这样的浮动是由手风琴不起作用的元素。当我删除了“浮动:左;” - 一切又恢复了正常。
和它不与jquery1.3.2采取从这个相同的设置可与jquery1.3.0事实远而不是 - 所以东西还是不对劲
!解决方案
我相信你的选择$(this).next(".accordion div")
将无法正常工作。下一个()只抓住下一个同级因此这样做的滤波器,着眼于儿童为奇数。
也试图使用选择与节点名称而不是纯CSS类选择。
使用div.accordian
而不仅仅是.accordian
在你的js
尝试
$(function() {
$("div.accordion h4").eq(2).addClass("active");
$("div.accordion div").eq(2).show();
$("div.accordion h4").live('click', function(){
var $el = $(this);
$el.next()
.slideToggle("slow")
.siblings("div:visible")
.slideUp("slow");
$el.toggleClass("active");
$el.siblings("h4").removeClass("active");
});
$("div.accordion div").hide();
$("h4#open").trigger('click');
});
其他提示
您可能需要升级你的手风琴库也是如此。有些样式选择喜欢的手风琴用途可能已经被弃用[@attr]
风格的选择。
不隶属于 StackOverflow