2012-02-29 7 views
0

ユーザーが入力フィールドに入力するときに私のビューの一部を更新したいと思います。当初、私は、ビューのeventsフィールド内keyupイベントリスナーにバインドされ、それがうまく働いた:Backbone.js:ビュー内でカスタムイベントを呼び出す?

window.AppView = Backbone.View.extend({ 
el: $("#myapp"), 
events: { 
    "keyup #myInput": "updateSpan", 
}, ... 
updateSpan: function() { 
    this.span.text(this.input.val()); 
}, ... 
}); 

をしかし、私はkeyupがあまりにも頻繁に更新することを実現し、アプリが遅くなりました。そこで私はtypeWatch pluginを使用することに決めました。そのため、ユーザーは入力を中止しただけのイベントを発生させました。しかし、今私はバックボーンでカスタムイベントリスナーを設定する方法がわかりません。

window.AppView = Backbone.View.extend({ 
initialize: { 
    var options = { 
     callback: function(){ 
     alert('event fired'); 
     this.updateSpan; 
     }, 
     wait:750 
    } 
    this.input.typeWatch(options); 
}, ... 
updateSpan: function() { 
    this.span.text(this.input.val()); 
}, ... 
}); 

つの質問:現在、私はこれ持って

  1. を私は警告が表示されますが、updateSpanは解雇されていません。コールバックでthisが正しく使用されていないと思いますが、どうすればよいですか?
  2. initializeはtypeWatchイベントリスナーを設定するのに適していますか、以前のようにeventsフィールドを引き続き使用できますか?

答えて

1

あなたは実際にupdateSpanを呼び出していません。正しい場合は、thisは正しいものではありません。それは、ベース要素にとrenderでいた場合、それはない場合は、通常、私はinitializeにこのような機能を添付しますあなたの2番目の質問については

var v = this; 
    var options = { 
    callback: function() { 
     alert('event fired'); 
     v.updateSpan(); 
    }, 
    wait: 750 
    }; 
    this.input.typeWatch(options); 

:それを解決する最も簡単な方法は、単に最初の別の変数にビューをキャプチャすることです私はこの場合、おそらく正しいと思うと思います。

関連する問題