Question

$("li").draggable({
            helper: "clone"
        });

        $("#div1").droppable({
            drop: function (event, ui) {
                $("<p></p>").appendTo("#div1");

            }
        });

我在列表中有对象，可以将其拖放到名为div1的div中。但是当我把一个放入div时，我不想让另一个进入它。我尝试过使用for，if和while循环计数。

Answer 1

这是一个完整的解决方案，它只允许丢弃一个项目，但是，如果存在一个项目，它将在下一个项目中被替换为新项目。（如果有人改变了主意，可以使用。只需致电

refreshDragDrop(dragClassName,dropDivId); 

refreshDragDrop = function(dragClassName,dropDivId) {
  $( "." + dragClassName ).draggable({
    connectToSortable: "#" + dropDivId,
    helper: "clone",
    revert: "invalid"
  });
  $("#" + dropDivId).droppable({
    accept: '.' + dragClassName,
    drop: function (event, ui) {
      var $this = $(this),
        maxItemsCount = 1;
      if ($this.children('div').length == maxItemsCount ){
        //more than one item,just replace
        $(this).html($(ui.draggable).clone());
      } else {
        $(this).append($(ui.draggable).clone());
      }
    }
  });
}

Answer 2

这应该有所帮助：

drop: function (event, ui) {
    var $this = $(this),
    maxItemsCount = 1;

    if ($this.children('li').length > maxItemsCount ){
        ui.sender.draggable('cancel');
        alert("To much items!");                
    }    

}

只允许一个对象被丢弃jquery

2 个答案: