11

簡単ですね。しかし、私はカスタム スクロール コントロール ( http://github.com/inuyaksa/jquery.nicescroll ) を使用しており、draggable() を使用するときにこれを防ぐために見たトリックのほとんどを試しました。しかし、彼らはこれのために働いていません...私はここにページとコードをアップロードしました:

デモ: http://www.beforethecode.net/blazin ソース: http://www.beforethecode.net/blazin/blazin.zip

これはタッチ スクリーン プロジェクト用です。これまでのところ、私の唯一の解決策は、$thumbs を 'dblclick' にバインドして、マウス/指をドラッグした後に起動を停止することでした...しかし、スクロールが停止した後、シングルクリックで動作させたいと思っています。

4

4 に答える 4

3

あなたの最善の策は、ネイティブイベントをキャンセルし、代わりにタイムアウトとフラグを使用して、必要な状況でのみ動作するオートコンプリートの数に似たソリューションになります。

  1. event.preventDefault()関連するコントロール、タグなどの「クリック」イベント<a />(つまり、クリックのトリガーに関連するネイティブ ブラウザーの動作を発生させない)。
  2. デフォルトを防止した後の「クリック」イベントでは、クリック アクションを小さくsetTimeoutして、タイムアウト ハンドルを保存します。
  3. 「stopdrag」イベントで、タイムアウト ハンドルをクリアします。これは理論的には「クリック」イベントのタイムアウト期間中に発生し、論理的なストップドラッグの後にクリックが発生するのを防ぎますが、実際のクリックではタイムアウトをキャンセルするためのストップドラッグはありません (そのため、アクションは必要に応じて実行されます)。

コード：

var clickActionTimeout = null;

function clearClickActionTimeout() {
  if(clickActionTimeout) {
    clearTimeout(clickActionTimeout);
    clickActionTimeout = null;
  }
}

$elem.click(function(e) {
  e.preventDefault();
  clearClickActionTimeout();
  clickActionTimeout = setTimeout(function() {
    // This was a real click if we got here...
    openPicture();
  }, 200);
});

$elem.bind('stopdrag', function() {
  clearClickActionTimeout();
});
于 2013-05-29T09:57:37.503 に答える
1

タッチ イベントを管理する方法がわかりません。ただし、これはクリックイベントに対して行う方法であり、それらのhttp://jsfiddle.net/USvay/と大差ないと思います

アイデアは、クリックイベントを防ぐことであり、代わりに、特定の時間が経過したか経過していない場合に、マウスアップで欲望関数が起動します。

var clicked = true,
    tOut;

$('a').on('click', function (e) {
    e.preventDefault();
}).on('mousedown', function () {


    tOut = setTimeout(function () {
        clicked = false;
    }, 200);



}).on('mouseup', function () {

    if (clicked == true) {
        clearTimeout(tOut);
        my_function();

    } else {
        clicked = true;
        $('<p>Dragged</p>').appendTo('#result');
    }

});

function my_function() {
    $('<p>Clicked</p>').appendTo('#result');
}
于 2013-06-05T05:10:57.697 に答える