2

見つけた jQuery shuffle プラグインに問題があります。ネストされたソート可能なリストが壊れます。下部に、問題を示すデモへのリンクを配置しました。これについては、以下で説明します。

HTML は単純で、4 つのリスト項目を含む順序付けられたリストがあります。これらの各リスト項目には、2 つのリスト項目を持つ順序付けられていないリストが含まれています。下部には、順序付きリストをシャッフルするためのボタンがあります。

  <ol> 
    <li> 
      <ul> 
        <li>Item A</li> 
        <li>Item B</li> 
      </ul> 
    </li> 
    <li> 
      <ul> 
        <li>Item C</li> 
        <li>Item D</li> 
      </ul> 
    </li> 
    <li> 
      <ul> 
        <li>Item E</li> 
        <li>Item F</li> 
      </ul> 
    </li> 
    <li> 
      <ul> 
        <li>Item G</li> 
        <li>Item H</li> 
      </ul> 
    </li> 
  </ol> 
  <button type="button" class="shuffle">Shuffle</button>

順序付きリストはソート可能で、順序なしリストもソート可能で接続されています (たとえば、「アイテム A」を「アイテム G」の下に移動できます)。ここまでは順調ですね！

$(document).ready(function () {

  $('ol').sortable({
    placeholder: 'dashed'
  });
  $('ul').sortable({
    placeholder: 'dashed',
    connectWith: 'ul'
  });
  $('.shuffle').button().click(function(){
    $('ol').shuffle();
  });

});

シャッフル ボタンは (ほぼ) 私が期待することを行います。順序付きリストをシャッフルします (順序なしではありません!)。しかし、そうすると、順序付けられていないソート可能なリストも壊れます。シャッフルする前に機能していたように、要素を移動することができなくなりました。

私は何か間違ったことをしていますか？プラグインにバグはありますか？

プラグインへのリンク: http://yelotofu.com/labs/jquery/snippets/shuffle/jquery.shuffle.js

問題のデモへのリンク: http://jsbin.com/umeju6

4

1 に答える 1

0

いくつかのテストの後、これを行うとうまくいくことがわかりました：

$(document).ready(function () {

  $('ol').sortable({
    placeholder: 'dashed'
  });
  $('ul').sortable({
    placeholder: 'dashed',
    connectWith: 'ul'
  });
  $('.shuffle').button().click(function(){
    $('ul').sortable("destroy");
    $('ol').shuffle();
    $('ul').sortable({
      placeholder: 'dashed',
      connectWith: 'ul'
    });
  });

});

理由はわかりませんが。それは非常にエレガントなソリューションでもありません。

于 2011-02-17T14:11:09.647 に答える