Question

我正在使用jquery sortable和contenteditable问题是当我使用jquery sortable时contenteditable不工作所以我搜索了stackoverflow我有解决方案但是当我实现它现在问题是mousedown事件可排序是不工作。

我在做什么。

Here is the stackoverflow link

<div class="sortable">
  <div id="" style="background: #eee; width: 80%; margin: 10px auto; padding: 10px;">
    <p contenteditable="true" style="padding: 5px;">Add your text here.</p>  </div>
    <div id="" style="background: #eee; width: 80%; margin: 10px auto; padding: 10px;">
    <p contenteditable="true" style="padding: 5px;">Add your text here.</p>  </div>
    <div id="" style="background: #eee; width: 80%; margin: 10px auto; padding: 10px;">
    <p contenteditable="true" style="padding: 5px;">Add your text here.</p>  </div>
</div>

首先我使用此代码

$('.sortable').sortable();

其次我正在使用此代码

$('.sortable').on('onmousedown', function() {
        $(".sortable").sortable({
            cursor: 'move'
        });
    })

Answer 1

将onmousedown更改为mousedown

$('.sortable').on('mousedown', function() {
    $(".sortable").sortable({
        cursor: 'move'
    });
})

同样在p的点击事件中销毁可排序的

 $('p').on('click', function() {
    $( ".sortable" ).sortable( "destroy" );
});

http://jsfiddle.net/fum9sf2m/

Answer 2

$(window).on('mouseup','.sortable',function(){
     $( ".sortable" ).sortable( "destroy" );
}

jQuery UI可排序＆amp; CONTENTEDITABLE =真

2 个答案: