メインコンテンツに移動

メインナビゲーション

  • ホーム
  • サイトマップ
  • ビデオ
  • ご連絡

パンくず

  • ホーム
  • jQueryのイベントにネームスペースについて

jQueryのイベントにネームスペースについて

javascript
jQuery

jQueryのイベント名にネームスペースをつけることができます

  • イベント(例:clickなど)名+”.”+ネームスペース
    // イベントの発火
    $('.class').trigger('click.namespace-1');  
    // イベントのリスナー
    $('.class').bind('click.namespace-1', function(){ do something }); 
    

イベントのネームスペースに対応するリスナー/ネームスペースのイベントがすべてのリスナーへ

  • 特定なネームスペースのイベントがそのネームスペースのイベントリスナーより対応します
  • ネームスペースのないイベントがすべてのイベントリスナーに対応されます
    jQueryのイベントにおけるネームスペース

イベントのネームスペースより複数のイベントハンドラーをつけることができます

  • 一つのイベントが複数の違う処理のハンドラーより実行することができます
    // 一つのイベント
    $('.class').trigger('click');
    
    // 複数のハンドラーで別々の処理
    $('.class').bind('click.namespace-1', function(){}); 
    $('.class').bind('click.namespace-1.namespace-2', function(){}); 
    $('.class').bind('click.namespace-2', function(){}); 
    $('.class').bind('click', function(){}); 
    
    

イベントのネームスペースより特定なイベントハンドラーを外すことができます

  • 別々処理のリスナーをイベントネームスペースより個別に除去することができます
    // 四つのclickに関するリスナー
    $('.class').bind('click.namespace-1', function(){}); 
    $('.class').bind('click.namespace-1.namespace-2', function(){}); 
    $('.class').bind('click.namespace-2', function(){}); 
    $('.class').bind('click', function(){}); 
    
    // click.namespace-2 のリスナーを除去します
    $('.class').unbind('click.namespace-2'); 
    // .namespace-2 のリスナーをすべて除去します(セレクターのような使い方)
    $('.class').unbind('.namespace-2'); 
    

 

ホーム

古松

検索

Article Category

  • apache(7)
  • css(19)
  • drupal(295)
  • Electron(4)
  • html(34)
  • javascript(27)
  • laravel(4)
  • linux(5)
  • macOS(2)
  • mysql(13)
  • php(19)
  • python(4)
  • SEO(12)
  • video(72)
  • Visual Studio Code(4)
  • windows(13)
  • wordpress(32)