jQuery ui 可排序答案

【问题标题】：Jquery ui sortablejQuery ui 可排序
【发布时间】：2017-08-25 18:24:46
【问题描述】：

我在下面的代码中添加了一些排序和编辑工具，如下所示：

但如果我先点击启用排序，然后启用编辑，编辑将不起作用。

更新：对于那些需要它的人$('.content').enableSelection(); 已添加并且它可以工作。

$(document).ready(function(){
  $(document).on('click','ul>li',function(){
    var id = $(this).attr('id');
    if(id=="enables"){
      $('.part>span').attr('contenteditable','false');
      $('.content').sortable({
        containment: "parent"
      });
      $('.content').disableSelection();
    }else if(id=="enablee"){
      $('.content').sortable("destroy");
      $('.part>span').attr('contenteditable','true');
      $('.content').enableSelection();
    }
  });
});

.content{
  width: 500px;
  height: auto;
  float: left;
  overflow: hidden;
}
.part{
  width: 100%;
  height: 50px;
  float: left;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div class="content">
  <div class="part" style="background:red"><span>ssssssssss</span></div>
  <div class="part" style="background:blue"><span>sssssss</span></div>
  <div class="part" style="background:green"><span>ssssss</span></div>
  <div class="part" style="background:yellow"><span>ssssss</span></div>
</div>
<ul>
  <li id="enables">Enable sorting</li>
  <li id="enablee">Enable editing</li>
</ul>

【问题讨论】：

你有没有试过把 $('.content').enableSelection();在“else if”括号内？
现在我做到了，它可以工作了。谢谢朋友

标签： javascript jquery jquery-ui

【解决方案1】：

删除 $('.content').disableSelection();如果您的 if 条件下的函数应该可以正常工作，请不要按照文档中的建议使用此函数

点击以下网址了解更多详情。 http://api.jqueryui.com/disableSelection/

【讨论】：