使用 :lt(3) 选择器禁用每个元素的可拖动性

Question

我有以下工作代码：

$stock.click(function () {
    $waste.append($stock.children('.container:lt(3)').card('upturn').droppable('disable').css( "left", function(i) {return ["0rem", "2rem", "4rem"][i];}) ); //3 divs
  });

这段代码为 3 个 div 添加了几个类，除了 css。每个 div 使用不同的 left 属性：

.css( "left", function(i) {return ["0rem", "2rem", "4rem"][i];})

这一切都有效，但我还想禁用前 2 个 div 的可拖动选项。

我尝试过类似 (1) 的方法：

.draggable('disable', function(i) {return ["true", "true", "false"][i];})

和（2）

.draggable(function(i) {return ['disable', 'disable', 'enable'][i];})

但是 try (1) 会禁用所有 3 个 div，而不仅仅是前 2 个，并且 try (2) 根本不起作用。

我怎样才能做到这一点？

非常感谢

Answer 1

可拖动小部件的 disabled 属性是使用 option 方法设置的，该属性需要一个布尔值，另一方面是 css jQuery 方法接受一个函数作为第二个参数，但 disable 方法或 disabled 属性不接受。最好的方法是使用 each 方法迭代每个项目：

.each(function(i){ $(this).draggable("option", "disabled", [false, true, true, false][i]) });

jsfiddle