2012-04-22 16 views
0

は、私はこのカウントダウンタイマーjavascriptプラグインで値を返す関数を作成するにはどうすればよいですか?

(function($){ 

    var options = { 
     display_as_text  : false, 
    remaining : 0, 
     separator   : ':', 
     significant_days : 3, 
    display_on_complete : null, // id of element to display when countdown is complete 
    hide_on_complete : null // hide the timer once it hits zero 
    }; 

    $.fn.countdown = function (config_options) 
    { 
     /* 
     * Initialise 
     * 
     * Prepare data and trigger regular execution of code 
     * 
     * @param container Reference to DOM element where counter will be displayed 
     */ 
     var initialise = function (container){ 

     } 

     var update = function (seconds_remaining){   

     } 

を持っていると私は私がで送った値に基づいて時間をアップデートにアクセスしてリセットする必要がありますが、私はそれにアクセスする方法を知りません。ここで私はプラグイン

$('#timer').countdown({remaining : 1000}); 

をインスタンス化が、どのように私は秒を更新するための更新プログラムを呼び出して...私はそれを変数に設定し、それを呼び出そうとしましたないが、何も行くん...任意のアイデア

答えて

0
方法です

残りの秒を取得するか、プラグイン内でupdate関数を呼び出すかどうかはわかりません。しかしどちらかの方法これが完全なソースを見ることなくプラグインに含まれているかどうかを知ることは不可能です。

あなたがそれを操作する場合は、必ずプラグインの範囲内でこのようなものを使用して、プラグインにカスタムAPIを追加することができます

$(this).data('countdown', { 
    update: update 
}); 

次に使用してそれを呼び出す:

$('#timer').data('countdown').update(12345); 

同じ考え方(内部変数がseconds_remainingと仮定して)残りの秒数などの内部変数を取得するために機能します。

$(this).data('countdown', { 
    getSecondsRemaining: function() { 
     return seconds_remaining; 
    } 
}); 

そして:

$('#timer').data('countdown').getSecondsRemaining(); 
1

最も一般的な方法は、(私が見てきたことに)物事のjQuery-UIスタイルを行うことです。

  1. $(selector).plugin({...})は、プラグインを結合し、通常の方法で連鎖することができます。
  2. $(selector).plugin('method')アクセサーとしてmethodを呼び出します。
  3. $(selector).plugin('method', arg)は、argのミューテータとしてmethodを呼び出します。

だからあなたの場合には、あなたが$(selector).countdown('update', 11)ようなものを言うことができるように、あなたのプラグインに引数の解析ロジックのビットを追加したいと思います。

あなたは、プラグインが呼び出された方法を見つけ出すと、可変長引数リストを引き離すために$.isPlainObjectargumentsを使用することができます。

$.fn.countdown = function(options) { 
    if(!$.isPlainObject(options)) { 
     var stdarg = Array.prototype.slice.call(arguments); 
     if(stdarg[0] == 'update' && stdarg.length > 1) { 
      return this.each(function() { 
       // Set up value using stdarg[1] 
      }); 
     } 
     // ... 
    } 

    return this.each(function() { 
     // Bind as usual 
    }); 
}; 

そして簡単なデモ(現実にはもちろん、クリーンで、より良い組織されるでしょう): http://jsfiddle.net/ambiguous/DEVBD/

関連する問題