jquery - 在锁定的可排序图层上编辑文本字段？

Question

我想

1. 编辑每个可排序的文本字段；
2. 防止一些可排序的图层被拖动。

为了防止拖动（#2），我按照api 的说明进行操作：

$( ".selector" ).sortable({ cancel: ".donotmoveme" });

但是，现在无法再编辑该不可排序图层上的文本字段。

这是问题的演示：

http://jsfiddle.net/D6yzf/

这是相关代码：HTML：

<div class="sortable">
    <div class='donotmoveme'>
        <input type="text">
    </div>
    <div>
        <input type="text">
    </div>
</div>

JS：

$( ".sortable" ).sortable({
    'cancel':'.donotmoveme'
});

Answer 1

嗯，我不确定问题的确切原因，但这里有一个解决方案 jsFiddle

您可以添加一个句柄，用于拖动可排序中的元素。

此外，如果您已经看到，当您指定取消属性时，它实际上不是 .notme被禁用的输入文本，而是被禁用的其他输入。

.js

$( ".sortable" ).sortable({
        cancel:'.notme',
    handle:".sort"
});

.html

<div class="sortable">
    <div>
        <input type="text">
            <span class="sort">sort handle</span>
    </div>
    <div class="notme">
        <p>not me</p>

        <input type="text">
            <span class="sort">sort handle</span>
    </div>
</div>