小编lok*_*pse的帖子

如何使用jQuery正确排序多个手风琴

这是我第一次发帖,所以如果我没有提供足够的细节,请告诉我.

我有一个包含多个手风琴的页面.我想使用多种手风琴,因为我希望用户能够同时打开多个部分,这对于手风琴来说不是原生的.

我也希望用户能够对那些手风琴进行排序.当前页面的设置方式,用户可以毫无问题地对手风琴进行排序.

当用户对手风琴进行排序时,我有一个脚本将关闭所有现有的手风琴,将它们的ID存储在一个数组中,然后在用户完成排序时重新打开它们.那部分也很好.

当您尝试将要排序的部分放在先前打开的两个部分之间时,会发生此问题.似乎jQuery不能轻易地告诉一个部分开始的位置,并且一个部分以编程方式关闭时结束.请注意,如果它们已经关闭,它会按预期工作.

我已经尝试了几种解决这个问题的方法,包括在部分之间添加一个间隔div以及破坏手风琴,然后在分类完成后重新初始化它们无济于事.

我怀疑问题出现了,因为当第一次抓住手风琴时,这些部分是开放的.但是在那一点上,我关闭所有部分,即使该部分关闭,当你试图在两个部分之间放置一个部分时,它会导致这些部分偶尔跳转.

我还注意到手风琴内容的高度因素.在下面的例子中,第一个div在打开时会引起问题而你试图对它们进行排序,但其他不那么.

这是我的代码.jQuery是基本的jQuery库,我编写的内容包括inline以简化:

<html>
<head>
<link href="/css/flick/jquery-ui.css" media="screen" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript" src="/js/jquery-ui.js"></script>
<script type="text/javascript">
  $(document).ready(function() {
    // Add Accordion stuff
    $(".accordion").accordion({
      autoHeight: false,
      active: false,
      collapsible: true
    }); // end $(".accordion").accordion

    // Add sortables
    $('.sortable').sortable({
      start: function(e, ui) {
        container = $(e.target);

        var parent_id = container.parent().parent().attr('id');
        expanded_ones = new Array();
        var count = 0;
        var summary = '';
        var child = '';
        var active = '';

        // now close …
Run Code Online (Sandbox Code Playgroud)

jquery jquery-ui accordion jquery-ui-sortable

6
推荐指数
1
解决办法
2633
查看次数

标签 统计

accordion ×1

jquery ×1

jquery-ui ×1

jquery-ui-sortable ×1