1

ここに私が取り組んでいるJSfiddleがあります。

各アイテムをそれらの間で出し入れできる2つのリストを作成しようとしています。変更は、更新機能/ソートステータスdiv領域内で下に更新されます。

3 行目の最初のアラートは機能しますが、5 行目のクリック関数を呼び出すと、6 行目のアラートは機能しません。全体的に、コードに何かが欠けているか、セミコロンなどがずれている可能性があると思います。助けてフィードバックを残してください、ありがとう。

$(document).ready(function() {
 alert(0);
 $(".shopping_list").onclick(function() {
    alert(1);
    $("#names #places").sortable({
         containment: 'parent', 
        tolerance: 'pointer',
        cursor: 'pointer', 
        revert: true, 
        opacity: 0.60,
        connectWith:"#names #places",
        update: function(event, ui) {
             content = $(this).text();
              $('#sort_status').text(content);
        }
    })

 });
});
4

2 に答える 2

0

グリソムが彼の回答とコメントで指摘したように、

  • まず、追加する必要がありますjQuery-UI。
  • $("#names #places")#placeselement内の要素を検索します#names。両方の要素を選択するには、 のようにコンマで区切る必要があります$("#names , #places")。
  • ソート可能な初期化をクリック イベントから移動する必要があります。

それ以外：

  • 封じ込めを削除する必要があります:'parent'そうしないと、アイテムを現在のリストからドラッグできません(したがって、リスト間でアイテムを移動することはできません)。

    デモ

  • <h3>ヘッダーをソート可能にしたい場合を除き(これも無効ですHTML) 、ヘッダーを<ul>

デモ

于 2014-06-27T07:25:02.417 に答える