1

这是我正在使用的JSfiddle 。

我正在尝试创建两个列表，我可以从中将每个项目移入和移出它们，并且更改将在下面的更新功能/排序状态 div 区域内更新。

我在第 3 行的第一个警报有效，但是当我在第 5 行调用 click 函数时，第 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

Like grissom pointed out in his answer and comments,

  • Firstly you need to add jQuery-UI.
  • $("#names #places") searches for an element#places inside an element #names. To select both the elements, you need to comma separate them like $("#names , #places").
  • You should move the sortable initialization out of the click event.

Other than that:

  • You need to remove containment: 'parent' otherwise you can't drag the item out of the current list (hence you can't move items between the lists, obviously)

    Demo

  • Unless you want the <h3> headers to be sortable (this is also invalid HTML) - you need to move them out of the <ul>

Demo

于 2014-06-27T07:25:02.417 回答
0

首先： $("#names #places")这意味着您有 id 为“names”的元素，并且该元素有 id 为“places”的子元素。

您必须设置可排序的每个列表。另外： $(".shopping_list").onclick应该是：

$(".shopping_list").click
于 2014-06-26T19:17:10.227 回答