ホームページ  >  記事  >  ウェブフロントエンド  >  jQuery で click イベントと dblclick イベントを同時に追加する例

jQuery で click イベントと dblclick イベントを同時に追加する例

黄舟
黄舟オリジナル
2017-06-27 10:36:461434ブラウズ

イベントを追加するコードは比較的単純で、メソッドは2つあります:

  • $("abc").bind({"click":fn,"dblclick":fn});

  • $ ("abc").click(fn).dblclick(fn)

現在の問題は、ダブルクリックまたはクリックに関係なく、クリック機能のみが実行されることです。なぜでしょうか。

ダブルクリックのメカニズムについて話しましょう:

ダブルクリック (dblclick) のプロセスは次のとおりです: マウスダウン、マウスアウト、クリック、マウスダウン、マウスアウト、クリック、dblclick

ダブルクリックを実現するには、これら 2 つをブロックする必要があります。クリックが発生するため、関数の実行を遅らせるために click に

タイマー を設定します。 完全なコードは次のとおりです:

//绑定点击和双击事件
                    var _time = null;
                    $(this).find("tr").dblclick(function(e){
                        clearTimeout(_time);
                        console.log("dblclick");
                        //真正双击代码

                    }).click(function(e){
                        clearTimeout(_time);
                        _time = setTimeout(function(){
                            console.log("click");
                            //单击事件在这里

                        }, 300);
                    });

以上がjQuery で click イベントと dblclick イベントを同時に追加する例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。