Question

我使用jQuery UI .droppable将元素删除到div。现在，如果它们不为空，我需要阻止使用类.box的div。

我试过了：

if ($('.box').is(':empty')) {
    $(".box").droppable({

    });
}

但这会使所有.box div不可丢弃，无论它们是否为空。

Answer 1

下面的代码将检查，类box的元素是否包含任何文本或其他元素。您可以尝试将文本或子元素添加到该div以确保它正在工作：

＆＃13;

if (!$('.box').text() && $('.box').children().length === 0) {
  console.log("droppable");
  /*$(".box" ).droppable({
    // code here
  });*/
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="box"></div>

＆＃13;

Answer 2

所以解决方案是：

$(".box").droppable({
    accept: function() {
        return $(this).find("*").length == 0;
    },
    drop: function(event, ui) {
        var $this = $(this);
        $this.append(ui.draggable.css({
            top: 0,
            left: 0
        }));
    }
});

如果它不是空的话，防止掉到div

2 个答案: