callbacks . fireWith( context )

投稿日: 2013年11月29日 作成者: alphasis

jQuery API の callbacks.fireWith( context ) は、コールバックオブジェクトのコールバック関数群を呼び出すメソッド。呼び出す際、コンテキストを指定し、コールバック関数群に引き渡せる。

このメソッドの引数に指定するコンテキストは、コールバック関数内において、「this」キーワードで参照する要素のこと。

記述方法（構文）

callbacks . fireWith( コンテキスト )

コールバック関数に渡したい値を配列に格納し第２引数に指定することもできるが、それについては「callbacks . fireWith( context[, args] )」のページにて。

引数

context / コンテキスト

コールバック関数内において、「this」キーワードで参照させたい要素を指定する。

戻り値

Callbacks Object

コールバックオブジェクト。

記述例

var callbacksObject = jQuery . Callbacks();
callbacksObject.add( function() {
    // コールバック関数内の処理文。
    // コールバック関数内の「this」キーワードは、コンテキストに指定した要素を参照する。
} );
callbacksObject.fireWith( コンテキスト );

実装例（サンプル）

実装例（サンプル）の動作について

  • 「ボタンＡ」ボタンをクリックする度に、ボタンの右横に「★」を追加する。
  • 「ボタンＢ」ボタンをクリックする度に、ボタンの右横に「★」を追加する。

実装例（サンプル）のソースコード

JavaScript

<script type="text/javascript">
<!--
jQuery( function() {
    var $callbacksObject = jQuery.Callbacks();
    $callbacksObject.add( function() {
        jQuery( this ).append( '★' );
    } );
    var $countA = 1;
    jQuery( "#sampleButtonA" ).on( "click", function() {
        if( $countA == 1 ){
            $callbacksObject.fireWith( jQuery( '#sampleOutputA' ) );
            $countA = 2;
        }else{
            $callbacksObject.fireWith( jQuery( '#sampleOutputA' ) );
            $countA = 1;
        }
    } );
    var $countB = 1;
    jQuery( "#sampleButtonB" ).on( "click", function() {
        if( $countB == 1 ){
            $callbacksObject.fireWith( jQuery( '#sampleOutputB' ) );
            $countB = 2;
        }else{
            $callbacksObject.fireWith( jQuery( '#sampleOutputB' ) );
            $countB = 1;
        }
    } );
} );
// -->
</script>

HTML

<p>
    <button id="sampleButtonA">ボタンＡ</button>
    <span id="sampleOutputA"></span>
</p>
<p>
    <button id="sampleButtonB">ボタンＢ</button>
    <span id="sampleOutputB"></span>
</p>

スポンサード リンク

カテゴリー: API, JavaScript, jQuery, コールバックオブジェクト タグ: パーマリンク