Jquery UIでソート可能な、携帯用のドラッグアンドドラッグ

Question

jQuery UIのソート可能なリストがあります。私はそれをモバイルデバイス上で動作させようとしています。タッチパンチの回避策を使用しました。スクロールするには、ソート可能な関数を非アクティブ化する必要があります。これを行い、リスト要素のタフォールドでソート可能な関数をアクティブにします。それは問題なく動作していますが、問題は、要素を並べ替えることができるようにタポールドに置いておきたいことです。今度は、このようにしか動作しません。要素（タポールドストップ）を止めてから、再度ソートする必要があります。

HTMLコード：

<ul class="list-group" id="wrapper"> 
<li class="list-group-item">Block 1</li> 
<li class="list-group-item">Block 2</li> 
<li class="list-group-item">Block 3</li> 
<li class="list-group-item">Block 4</li> 
<li class="list-group-item">Block 5</li> 
<li class="list-group-item">Block 6</li> 
<li class="list-group-item">Block 7</li> 
<li class="list-group-item">Block 8</li> 
<li class="list-group-item">Block 9</li> 
<li class="list-group-item">Block 10</li> 
<li class="list-group-item">Block 11</li> 
<li class="list-group-item">Block 12</li> 
<li class="list-group-item">Block 13</li> 
<li class="list-group-item">Block 14</li> 
<li class="list-group-item">Block 15</li> 
<li class="list-group-item">Block 16</li> 
<li class="list-group-item">Block 17</li> 
<li class="list-group-item">Block 18</li> 
<li class="list-group-item">Block 19</li> 
<li class="list-group-item">Block 20</li> 
<li class="list-group-item">Block 21</li> 
<li class="list-group-item">Block 22</li> 
<li class="list-group-item">Block 23</li> 
</ul> 

JSコード：ここ

$('#wrapper li').on('taphold', function(event, ui) { 
    $("#wrapper li").removeClass('selected'); 
    $("#wrapper").sortable({disabled:false}); 
    $(this).addClass('selected'); 
}); 

$("#wrapper").sortable({disabled:true,containment: "parent"}); 

$("#wrapper").on("sortupdate", function(event, ui) { 
    $("#wrapper").sortable({disabled:true}); 
}); 

は、例jsfiddle（https://jsfiddle.net/3cygah12/）です。

誰でもこの問題の解決方法を知っていますか？

Answer 1

のように全体のモバイルjQueryライブラリ（here）と仕事をダウンロードすることです。

Iは、タッチパンチ（http://touchpunch.furf.com/）tapholdするtouchstartを結合するこのようなコードの一部変性 -

mouseProto._mouseInit = function() { 

var self = this; 

// Delegate the touch handlers to the widget's element 
self.element 
    .bind('taphold', $.proxy(self, '_touchStart')) // IMPORTANT!MOD FOR TAPHOLD TO START SORTABLE 
    .bind('touchmove', $.proxy(self, '_touchMove')) 
    .bind('touchend', $.proxy(self, '_touchEnd')); 

// Call the original $.ui.mouse init method 
_mouseInit.call(self); 
}; 

を、またhttps://github.com/benmajor/jQuery-Touch-Eventsを用います。それは今働きます！

Answer 2

私はこの小さなプラグインと同じ問題に対処：

http://touchpunch.furf.com/

があなたのスクリプトにこのライブラリを追加します。

それを行うための別の方法は、私はそれを行うことに成功し、この

$('#yourSelector').on('touchstart mousedown', function(event){ 
    event.preventDefault(); 
    var touch = event.touches[0]; 
if(touch){ 
    //Do some stuff 
} 
else { 
    //Do some other stuff 
} 
});