ホームページ  >  記事  >  ウェブフロントエンド  >  jqueryのイベント名と名前空間について簡単に説明しましょう

jqueryのイベント名と名前空間について簡単に説明しましょう

一个新手
一个新手オリジナル
2017-09-08 13:46:051773ブラウズ

まえがき

jqueryの公式APIには、 http://api.jquery.com/on/ に「イベント名と名前空間」というタイトルで英語での紹介がいくつかあります。いくつかの紹介。 よく理解していない友達がいる場合は、ここで簡単に紹介しましょう。

jQuery イベント名前空間

まず、いくつかのコードを見てみましょう:

$(“#haorooms”).on("click.a",function(){});$(“#haorooms”).on("click.a.bb",function(){});$(“#haorooms”).on("dbclick.a",function(){});$(“#haorooms”).on("mouseover.a",function(){});$(“#haorooms”).on("mouseout.a",function(){});

もちろん、イベント バインディングにバインドを使用することもできます。上記のコードを見ると、イベントの後にピリオドを付けて名前を追加できます。これがイベント名前空間です。いわゆるイベント名前空間では、「click.a」などのイベントを参照するために、イベント タイプの後にドット構文でエイリアスを追加します。ここで、「a」は現在のイベント タイプ click のエイリアスです。イベント名前空間。

次の名前空間を削除したいとします:

$(“#haorooms”).on("click.a.bb",function(){});

使用できます:

$(“#haorooms”).off("click.a.bb");//直接删除bb命名空间 【推荐】$(“#haorooms”).off(".bb"); //直接删除bb命名空间 【推荐】$(“#haorooms”).off(".a"); //删除.a命名空间下面所有的子空间【包括.a.bb   .a.cc等等,.a是.bb的父级,因此.a下面的都会删掉】$(“#haorooms”).off("click");//直接解绑click,下面的命名空间都会删除。

次のことに注意してください:

次のコードを書くとします:

$(“#haorooms”).on("click",function(){});$(“#haorooms”).on("click.a",function(){});$(“#haorooms”).on("click.a.bb",function(){});

次に、使用する必要があります:トリガーからクリックへのトリガー イベント、つまり最初のイベントがトリガーされますが、click.a と click.a.bb の両方がトリガーされるのではありませんか。では、クリックだけをトリガーしたいのですが、クリックはトリガーしません。 a および次の名前空間?

関係ないよ! 以下の解決策があります:

イベント タイプに感嘆符が追加されている場合は、名前空間を含まない特定のイベント タイプがトリガーされることを意味します。

クリックだけをトリガーしたい場合は、次のように書くことができます:

$(“#haorooms”).trigger("click!")

bb のみをトリガーするには、次のように書くことができます:

$(“#haorooms”).trigger("click.a.bb");

名前空間を使用すると、同じイベントの管理が簡単になります。 ! !

カスタムイベント

ここでは説明しません!すべてのカスタム イベントは、jQuery メソッドを通じてトリガーできます。たとえば、次の例では、Delay イベント タイプをカスタマイズし、入力要素オブジェクトにバインドして、ボタンのクリック イベントでカスタム イベントをトリガーします。

$("input").bind("delay",function(event){
    setTimeout(function(){
          alert(event.type);
    },1000);});$("input").click(function(){
      $("input").trigger("delay"); //触发自定义事件});

カスタム イベントは、本当の意味ではイベントではありません。カスタム イベントのトリガーは、カスタム関数の呼び出しと同じです。

上記の紹介を通じて、jquery のイベント名と名前空間についてより深く理解できたでしょうか。メッセージや交換お待ちしております!


以上がjqueryのイベント名と名前空間について簡単に説明しましょうの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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