下午好，我有一些菜单可以通过选项卡拖放，对于第一个选项卡，您可以拖放，但是当您单击下一个选项卡时，您不能。
将选项卡移动到 2 等时，我无法拖放菜单。
这是我的代码。
如何使每个选项卡中的列表菜单都可以拖放？提前致谢
<ul class="nav nav-tabs nav-justified" id="menumanagerTab" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="superadmin-tab" data-toggle="tab" href="#superadmin" role="tab" aria-controls="superadmin" aria-selected="true"><span class="cap">superadmin</span></a>
</li>
<li class="nav-item">
<a class="nav-link " id="admin-tab" data-toggle="tab" href="#admin" role="tab" aria-controls="admin" aria-selected="true"><span class="cap">admin</span></a>
</li>
<li class="nav-item">
<a class="nav-link " id="supplier-tab" data-toggle="tab" href="#supplier" role="tab" aria-controls="supplier" aria-selected="true"><span class="cap">supplier</span></a>
</li>
</ul>
<div class="tab-content bd bd-gray-300 bd-t-0 pd-20" id="menumanagerTabContent">
<div class="tab-pane active" id="superadmin" role="tabpanel" aria-labelledby="superadmin-tab">
<div><input type="hidden" id="nestable-superadmin-output" />
<div class="dd" id="nestable">
<ol class="dd-list">
<li data-id="1" class="dd-item dd3-item">
<div class="dd-handle dd3-handle"></div>
<div class="dd3-content">
<div class="d-flex justify-content-between">
<div>Dashboard /</div>
<div class="btn-group btn-group-sm">
<a href="url" class="btn btn-primary btn-xs" title="Edit" data-toggle="tooltip" data-placement="top"><i class="fa fa-edit"></i></a>
<a href="url" class="btn btn-danger btn-xs" title="Delete" data-delete="" data-toggle="tooltip" data-placement="top"><i class="fa fa-trash"></i></a>
</div>
</div>
</div>
</li>
</ol>
</div>
</div>
</div>
<div class="tab-pane " id="admin" role="tabpanel" aria-labelledby="admin-tab">
<div><input type="hidden" id="nestable-admin-output" />
<div class="dd" id="nestable">
<ol class="dd-list">
<li data-id="8" class="dd-item dd3-item">
<div class="dd-handle dd3-handle"></div>
<div class="dd3-content">
<div class="d-flex justify-content-between">
<div>Dashboard /</div>
<div class="btn-group btn-group-sm">
<a href="url" class="btn btn-primary btn-xs" title="Edit" data-toggle="tooltip" data-placement="top"><i class="fa fa-edit"></i></a>
<a href="url" class="btn btn-danger btn-xs" title="Delete" data-delete="" data-toggle="tooltip" data-placement="top"><i class="fa fa-trash"></i></a>
</div>
</div>
</div>
</li>
</ol>
</div>
</div>
</div>
<div class="tab-pane " id="supplier" role="tabpanel" aria-labelledby="supplier-tab">
<div><input type="hidden" id="nestable-supplier-output" />
<div class="dd" id="nestable">
<ol class="dd-list">
<li data-id="16" class="dd-item dd3-item">
<div class="dd-handle dd3-handle"></div>
<div class="dd3-content">
<div class="d-flex justify-content-between">
<div>Dashboard /</div>
<div class="btn-group btn-group-sm">
<a href="url" class="btn btn-primary btn-xs" title="Edit" data-toggle="tooltip" data-placement="top"><i class="fa fa-edit"></i></a>
<a href="url" class="btn btn-danger btn-xs" title="Delete" data-delete="" data-toggle="tooltip" data-placement="top"><i class="fa fa-trash"></i></a>
</div>
</div>
</div>
</li>
</ol>
</div>
</div>
</div>
</div>
这是我的jQuery
$(function() {
var updateOutput = function(e){
var list = e.length ? e : $(e.target),
output = list.data('output');
if (window.JSON) {
output.val(window.JSON.stringify(list.nestable('serialize')));
} else {
output.val('JSON browser support required for this.');
}
};
$('#nestable').nestable().on('change', updateOutput);
updateOutput($('#nestable').data('output', $('#nestable-output')));
$('.dd').on('change', function() {
$("#success-indicator").hide();
var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
var dataString = {
data : $("#nestable-output").val(),
_token : CSRF_TOKEN
};
$.ajax({
type: 'POST',
url: '{{ url("dashboard/menu-manager/menusort") }}',
data: dataString,
cache : false,
success: function(data){
$("#success-indicator").show();
}
});
});
});