jquery ui sortable - 使用包含时拖动无法正常工作

Question

我遇到了 jquery ui 可排序问题，无法拖动某些项目（我猜是因为项目元素的高度）

\n\n

<div class="container">\n<fieldset>\n    <legend>handle 1 THIS CAN\'T BE DRAGGED BELOW HANDLE 2</legend>\n    <div>blah<br /></div>\n</fieldset>\n<fieldset>\n    <legend>handle 2 BUT I CAN DRAG THIS ABOVE HANDLE 1</legend>\n    <div style="display: none">blah<br /></div>\n</fieldset>\n

\n\n

\n\n

$(".container").sortable({\n   axis: \'y\',\n   handle: \'> legend\',\n   containment: \'parent\',\n   /*cursorAt: {top: 1},\n   start: function(event, ui) {\n      ui.placeholder.height(ui.item.height());\n      $(this).sortable(\'refreshPositions\');\n   },*/\n});\xe2\x80\x8b\n

\n\n

请参阅http://jsfiddle.net/ADyhR/10/ \n编辑：它似乎适用于 jquery ui 1.8.9。这只是 1.8.18 中的一个错误吗？

\n\n

注释掉的 javascript 行是我已经尝试过但还没有工作的东西，但我想我可能只是在使用它们的方式上略有偏差。

\n

Answer 1

您可以使用该tolerance选项并将其值设置为tolerance: "pointer",。我已经更新了您的演示并创建了一个新的演示。

以下是与添加的选项一起tolerance使用的 JS 代码：

$(".container").sortable({
    axis: 'y',
    tolerance: "pointer",
    handle: '> legend',
    containment: 'parent',
    /*cursorAt: {top: 1},
    start: function(event, ui) {
        ui.placeholder.height(ui.item.height());
        $(this).sortable('refreshPositions');
    },*/
});