jqueryのドラッグ可能な要素 - 携帯の小さな動き - onclickの火災を防ぐ

Question

私はonclick()イベントでのdiv持っている：私はこれにドラッグ可能にjQueryを追加すると

<div id="my_div" onclick="alert('you clicked me')"></div> 

はDIV：

$(function() { 
    $("#my_div").draggable(); 
}); 

それが正常に動作しますブラウザで しかし、モバイルで。

• モバイルデバイス上のユーザーがdivをタップすると、divはほんの少し移動します。
• 今、onclickは発砲しません。

これは一般的ですか？またはいくつかのCSSの問題？ 非常に慎重にタップしなければならないようです。 私は、ほとんどの人が指をいくらか動かすと思っていて、通常は小さな動きがあります。

移動量が少ないにもかかわらずモバイルでオンクリックが発生することを確認するにはどうすればよいですか？

Answer 1

クリック/タップとドラッグイベントの処理方法の違いは、デバイス間で大きく異なるため、結果は次のとおりです。誰もが1つの要素に両方を添付しません。 1つの例を探してみてください。そうした場合は、デバイス/クロスブラウザ間でテストすることを検討してください。

"default"解決策は、要素（少なくとも通常は移動アイコンを含む指40px * 40pxに適合する）に「ドラッグハンドル」コントロールを提供することです。また、ドラッグハンドルから開始された場合にのみ、要素のドラッグ可能な動作を有効にします。

もちろん、ハンドルを大きくしたい場合、要素は少し大きめの親の「ドラッグハンドル」でもかまいません。要素にはアクションバーも含まれています（ドラッグ操作は開始されませんが代わりに、あなたの行動を選択してください）。