jquery可排序/可选:过滤子控件

Question

我有一个包含嵌套div的div,如下所示:

<div id="tree" class="tree">
<div class="node"><div class="handle"></div>Node 1<div class="ignore"></div>
<div class="node"><div class="handle"></div>Node 2<div class="ignore"></div>
<div class="node"><div class="handle"></div>Node 3<div class="ignore"></div>
</div>

然后,添加sortable()和selectable()

$('.tree').sortable({
  handle:'.handle'
});

$('.tree').selectable();

我正在使用jQuery UI"可排序"行为,以便用户可以重新排序列表.问题是,当用户点击"忽略"类的div时,"可选"突出显示移动到该div.我想过滤可选择和可排序的行为,以便它们只捕获.node集,忽略.ignore测试,因为它包含一个工具箱,其控件不再接受点击.

建议？

Answer 1

对于sortable(),您可以指定要捕获的项目.

$('.tree').sortable({
  handle: '.handle',
  items: 'div:not(.ignore)'
});

我没有使用它,但看起来像selectable()有一个过滤器选项.也许试试这个:

$('.tree').selectable({
  filter: 'div:not(.ignore)'
});