2013-06-10 8 views
5

私のバックボーンの1つであるJQueryイベントに問題があります。私はいくつかのクリックイベントとキーボードイベントを定義しました。しかし、それらのうちのいくつかは動作していません。たとえば、fetch-functionは、keyupイベントがトリガーされるたびに呼び出されます。だからここkeyupイベントが起動していません - バックボーン

コードである:

return Backbone.Marionette.ItemView.extend({ 
    tagName: 'div', 
    template: Template, 
    events:{ 
    'click .yes': 'yes', 
    'click .no': 'no', 
    'keyup #citySearch': 'fetch' 
    }, 
    yes : function() { 
    this.close(); 
    }, 
    no : function() { 
    this.close(); 
    }, 
    initialize: function(){ 
    this.collection = new AreaCollection(); 
    this.collection.on('sync', this.onShow, this); 
    this.sourceArr = []; 
    }, 
    onShow: function() { 
     var that = this; 
     $('#citySearch').typeahead({ 
      source: that.sourceArr 
     }); 
    }, 
    fetch: function(ev) { 
    var that = this; 
    that.collection.fetch({ 
     data : { 
     query : $(ev.currentTarget).val(), 
     type : 'cities' 
     }, 
     success: function(response) { 
     for (var i = 0; i < response.length; i++) { 
      that.sourceArr.push(response.models[i].get('name')); 
     } 
     } 
    }); 
    } 

})。

ただし、keyup-Eventは実行されません。私はまた、 "変更" - イベントでそれを試しましたが、これも機能しません。代わりに "keydown"または "keypress"を使用すると、すべてが正常でfetch-functionが正しく呼び出されます。

私も

$('input#citySearch').bind('keyup',function() { 
     console.log('keyup'); 
    }); 

で初期化機能に手動で入力フィールドにイベントをバインドしようとしたが、これも機能していません。これは、アンダースコアテンプレートファイル内の入力フィールドにイベントをバインドする場合にのみ機能します。しかし、それは解決策ではありませんでした。

誰かが問題が何であるか考えている人はいますか?

+0

'typeahead()'によってフィールドにアタッチされたハンドラが 'keyup'をつかんで、伝播しないようにすることは可能でしょうか? – ebohlman

+0

これも機能していません。私はtypeahead-fieldの初期化を取り除き、再度keyup-eventを試しました。 – crebuh

答えて

7

私はこれについて1つの理由しか考えられません。それは:

input#citySearchはあなたのitemViewの一部ではありません。これは、であることを意味します。 fetch関数をkeyupイベントにバインドします。

ビューの外にあるものにバインドする場合は、その要素が存在するビューにイベントをトリガーできます。