Question

使用jQueryUI的可排序函数时遇到问题：

    <div class="sortable">
        <div class="ui-state-default">
            <h4></h4>
            <input type="text" />
            <button></button>
        </div>
        ...more <div>
    </div>

我的目标不是能够对整个div进行排序，而只能对输入元素进行排序。这可能吗？

我已经尝试了几件事，但没有任何效果......

$(".sortable").sortable({ items: "> input" });
$(".sortable").sortable({ items: "> input[type=text]" });
$(".sortable").sortable({ items: "> div > input" });
$(".sortable").sortable("option", 'items', 'div > input');

我已经google了一个解决方案，但除了这个similar question之外什么都没找到，但我不认为.cancel（）函数对我来说可能是一个解决方案。

任何帮助？

Answer 1

您遇到的问题是输入框本身不能作为可拖动的句柄。您需要将输入包装在span或div中，并在{ items: }标记中使用它。你仍然无法拿起输入框本身，所以我强烈建议你在div中使用一个手柄进行拖动，以使操作更直观。

或者，你可以在输入的顶部添加一个带有{ position: absolute; width: 100%; height:100% }的隐藏div作为句柄但是这会使你的输入无法实现，因为点击会击中该div而不是你的输入。

jQueryUI可排序 - 在“项目”中可能是复杂的选择器

1 个答案: