jQuery [Callbacks] コンテキストを指定してCallbacksオブジェクトを実行する

callbacks.fire()メソッドと似ていますが、引数として「コンテキスト」を渡せる点が異なります。コンテキストとして渡された要素は、Callbacksオブジェクトに登録された各コールバック関数の中で「this」で参照できます。fireWidth()の第2引数は配列またはオブジェクトで渡す必要があります。

書式

callbacks.fireWith(コンテキスト,引数)

callbacks.fireWith( $('#mydiv'), str );

サンプル

コールバック関数をコンテキストを指定して実行する

<body>
    <div class="main">
      <div class="header">
        <h1>サンプル</h1>
      </div>
      <div class="content">
        <form>
          <button class="button" type="button" name="button1">コールバック関数をadd</button>
          <button class="button" type="button" name="button2">Callbacksを関数を実行</button>
        </form>
        <div class="desc"></div>
      </div>
      <div class="footer">
        <hr>
        <p class="copyright">2024 xxxx all rights reserved.</p>
      </div>
    </div>
    <script>
      $(document).ready(function(){
       var callbacks = $.Callbacks();
       var myfunc1 = function(str){
        this.append(str + '<br>');
       }
       $('button[name=button1]').on('click',function(){
        callbacks.add(myfunc1);
        $('.desc').append('コールバックが追加されました<br>');
       });
       $('button[name=button2]').on('click',function(){
        callbacks.fireWith($('.desc'),['実行されました']);
       });
      });
      </script>
    </body>

カテゴリー:CallbacksオブジェクトJavaScriptjQuery