首页 > 编程语言> > javascript-激活时,第一次单击后jQuery手风琴会中断：设置为false

javascript-激活时,第一次单击后jQuery手风琴会中断：设置为false

2019-12-08 21:36:37 作者：互联网

我现在在我的网站上放了一个jQuery手风琴,直到我今天检查它并发现它坏了之前,它似乎还可以正常工作.我已经有几周没接触过HTML了.我再次经历了accordion documentation,似乎没有任何改变,所以我不知道发生了什么.

我已将手风琴的“活动”属性设置为“假”,以使手风琴在文档加载时不会显示活动部分.就像指定的文档一样,我也将“ collapsible”设置为“ true”.为了确保它不是页面上的另一个元素,我创建了一个全新的页面,上面只有最基本的手风琴元素,但它仍然无法正常工作.

问题是,在单击第一个手风琴部分之后,单击其他任何一个都不起作用,您将无法打开该部分.我注意到,删除“ active”属性可以完全解决此问题,但是当然,在文档加载时会打开一个活动部分,这是我所不希望的.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script>
  $(document).ready(function() {
    $("#accordion").accordion({active: false, alwaysOpen: true, autoHeight: false, collapsible: true});
  });
</script>
</head>
<body>
<div id="accordion">

    <p><a href="#">1</a></p>
    <div>this</div>

    <p><a href="#">2</a></p>
    <div>isn't</div>

    <p><a href="#">3</a></p>
    <div>working</div>

    <p><a href="#">4</a></p>
    <div>correctly</div>

</div>
</body>
</html>

我还注意到,如果我删除active：false,并保持可折叠状态为true,则我只能“折叠”一个部分两次,然后发生相同的事情-这些部分会锁定并停止折叠/打开.

解决方法:

好吧,我立即看到了以下问题：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

通过不指定revision(版本的最后三位数字),您将自动获得jQuery和jQuery UI的最新版本.所以为什么突然停止为您工作是因为jQuery UI得到更新,并且对UI手风琴进行了更改.

解决此问题的最佳方法是指定修订版本.从当前版本(1.8.7)向下浏览,直到向下运行为止.例如,alwaysOpen打开已被删除或更改.您应该检查docs并查看可用的选项.

另外,您可以尝试我在jsFiddle上进行的操作：

$(function(){
    $("#accordion").accordion({
        active: false,
        autoHeight: false,
        collapsible: true
    });
});

标签：accordion,javascript,jquery
来源： https://codeday.me/bug/20191208/2094318.html