1

我正在使用 jquery sortable 在页面上拖放块。但是我的手柄有问题。

块的 html 是这样的：

<div class="row insumo-editor-module" style="">
    <div class="span12 module-toolbar">
        <div class="btn-group pull-right">
            <button class="btn btn-inverse btn-remove-module"><i class="icon-remove-circle icon-white"></i></button>
            <button class="btn btn-inverse btn-move-module"><i class="icon-move icon-white"></i></button>
        </div>
    </div>

    <!-- More html here -->        
</div>

使其可排序的 javascript 如下（每个 .insumo-editor-module 都包含在 editor_zone 中，它是一个 div）。

editor_zone.sortable( {
    handle: '.btn-move-module',
    cursor: 'move',
    placeholder: 'placeholder',
    forcePlaceholderSize: true,
    opacity: 0.4,
}).disableSelection();

我试过直接在 .insumo-editor-module 中使用链接作为句柄，效果很好。我还完全删除了句柄属性并且它可以工作。但是，尝试使用 .btn-move-module 不起作用。

有没有办法使用嵌套的 html 作为句柄？

这里有一个jsfiddle

提前致谢

4

2 回答 2

2

问题解决了。您可以毫无问题地将句柄嵌套在其他元素中。通过用标准锚链接替换，可排序项目现在可以毫无问题地移动。

感谢 rusln 的帮助

于 2013-07-04T13:22:01.827 回答
1

Try to wrap your nested html to <li> tags inside <ul> and make ul as sortable.

Also take a look at items option on jquery.ui sortable widget:

$( ".selector" ).sortable({ items: ".row" });
于 2013-07-03T20:29:18.580 回答