我正在尝试使用jquery nestable创建一个嵌套列表,但希望在整个列表中禁用拖动功能。以下是我的html代码:
<div class="dd" id="nestable">
<ol class="dd-list">
<li class="dd-item" id="no-drag">
<div class="dd-handle">
Foo
<div class="pull-right action-buttons">
<a class="blue" href="#">
<i class="ace-icon fa fa-pencil bigger-130"></i>
</a>
<a class="red" href="#">
<i class="ace-icon fa fa-trash-o bigger-130"></i>
</a>
</div>
</div>
<ol class="dd-list">
<li class="dd-item" id="no-drag">
<div class="dd-handle">
Bar
<div class="pull-right action-buttons">
<a class="blue" href="#">
<i class="ace-icon fa fa-pencil bigger-130"></i>
</a>
<a class="red" href="#">
<i class="ace-icon fa fa-trash-o bigger-130"></i>
</a>
</div>
</div>
<ol class="dd-list">
<li class="dd-item" id="no-drag">
<div class="dd-handle">
Baz
<div class="pull-right action-buttons">
<a class="blue" href="#">
<i class="ace-icon fa fa-pencil bigger-130"></i>
</a>
<a class="red" href="#">
<i class="ace-icon fa fa-trash-o bigger-130"></i>
</a>
</div>
</div>
</li>
</ol>
</li>
</ol>
</li>
</ol>
我的脚本如下所示:
$('.dd').each(function(){
$(this).nestable({
maxDepth: 1,
group: $(this).prop('id')
});
});
目前,我能够创建嵌套列表并且用户可以重新排列嵌套列表。我想禁用该功能,但是我无法做到。请给予建议。
[data-action="collapse"] {pointer-events: all;}
- sousdev