在锁定的可排序层上编辑文本字段

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

您可以添加一个句柄，该句柄将用于在可排序文件中拖动元素。

此外，如果您已经看到，当您指定cancel属性时，实际上不是.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>