callbacks . lock()

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

jQuery API の callbacks.lock() は、コールバックオブジェクトをロックするメソッド。

ロックすると、コールバック関数の追加や呼び出しができなくなる。

jQuery . Callbacks( 'memory' )で生成したコールバックオブジェクトには、コールバック関数を追加できる。

記述方法（構文）

callbacks . lock()

戻り値

Callbacks Object

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

記述例

var callbacksObject = jQuery . Callbacks();
callbacksObject.add( function() {
    // コールバック関数内の処理文。
} );
callbacksObject.lock();
    // callbacksObjectをロックする。

実装例（サンプル）①

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

  1. 「Ｂ」ボタンをクリックすると、ボタンの右横に「false」と表示する。
  2. 「Ａ」ボタンをクリックすると、ボタンの右横に「$callbacksObjectAをロックしました。」と表示する。
  3. 「Ｂ」ボタンをクリックすると、ボタンの右横に「true」と表示する。

「ロック後は呼び出せない。」を表示しない点にも注目。

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

JavaScript

<script type="text/javascript">
<!--
jQuery( function() {

    function sampleFn( $arg1 ) {
        jQuery( this ).text( $arg1 );
    }

    var $callbacksObjectA = jQuery.Callbacks();
    $callbacksObjectA.add( sampleFn );

    var $callbacksObjectB = jQuery.Callbacks();
    $callbacksObjectB.add( sampleFn );

    jQuery( "#sampleButtonA" ).on( "click", function() {
        $callbacksObjectA
            .fireWith( jQuery( '#sampleOutputA' ), [ '$callbacksObjectAをロックしました。' ] )
            .lock()
            .fireWith( jQuery( '#sampleOutputA' ), [ 'ロック後は呼び出せない。' ] );
    } );

    jQuery( "#sampleButtonB" ).on( "click", function() {
        $callbacksObjectB.fireWith( jQuery( '#sampleOutputB' ), [ $callbacksObjectA.locked() ] );
    } );

} );
// -->
</script>

HTML

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

実装例（サンプル）②

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

  • 「ロック後。」「追加後。」は表示しない点に注目。
  • コールバック関数に渡した値はいずれも「ロック前」である点に注目。
  • $callbacksObjectA.has( sampleFnB )が「true」を返す点に注目。

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

JavaScript

<script type="text/javascript">
<!--
jQuery( function() {

    var $c = 1;
    function sampleFnA( $arg1 ) {
        jQuery( '#sampleOutputC' ).append( 'sampleFnA：' + $arg1 + '（' + $c++ + '回目の呼び出し。）<br />' );
    }
    function sampleFnB( $arg1 ) {
        jQuery( '#sampleOutputC' ).append( 'sampleFnB：' + $arg1 + '（' + $c++ + '回目の呼び出し。）<br />' );
    }

    var $callbacksObjectA = jQuery.Callbacks( 'memory' );
    $callbacksObjectA.add( sampleFnA );
    $callbacksObjectA.fire( 'ロック前。' );
    $callbacksObjectA.lock();
    $callbacksObjectA.fire( 'ロック後。' );
    $callbacksObjectA.add( sampleFnB );
    $callbacksObjectA.fire( '追加後。' );
    jQuery( '#sampleOutputC' ).append( $callbacksObjectA.has( sampleFnB ) + '<br />' );

} );
// -->
</script>

HTML

<p>
    <span id="sampleOutputC"></span>
</p>

スポンサード リンク

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