バックボーンに登録するためのボタンクリックイベントを取得するのに問題があります。その直前にリストしたイベント(入力でキーを押す)は正常に機能しています。
これが私の見解です:
App.Views.TaskAddForm = Backbone.View.extend({
tagName: 'div',
initialize: function(){
},
events: {
'keypress #newTask': 'createNewTask',
'click #newTaskBtn': 'createNewTask',
},
template: App.Templates.TaskAddForm,
render: function(){
this.$el.html(this.template());
this.$el.attr('id','taskAddForm');
if (!this.newTask){
this.newTask = this.$('#newTask');
this.newPriority = this.$('#newPriority');
}
return this;
},
createNewTask: function(e){
if (e.keyCode !== 13) {
return;
}
var task = this.newTask.val();
var priority = this.newPriority.val();
if ($.trim(task).length > 0){
this.collection.add({name: task, priority: priority});
}
this.clearForm();
},
clearForm: function(){
this.newTask.val('');
this.newPriority.val(1);
}
});
これが私のテンプレートです:
<h2>Add Task</h2>
<div class="input-append">
<select id="newPriority" class="input-medium" style="margin-right: 20px;">
<option value="1">Now</option>
<option value="2">Today</option>
<option value="3">Tomorrow</option>
<option value="4">Sooner</option>
<option value="5">Later</option>
</select>
<input type="text" id="newTask" placeholder="New Task" class="input-xxlarge">
<button class="btn" type="button" id="newTaskBtn">Add Task</button>
</div>
このテンプレートには実際には何も渡していないことがわかりますが、ユーザーが作業している内容に応じてこのフォームの追加ビューをページに追加および削除するため、引き続きテンプレートを使用したいと思いました。
入力のキー押下が機能します。そのすぐ隣のボタンをクリックしてください、そうではありません!レンダリング関数にthis.delegateEvents()を追加しようとしましたが、ボタンが機能するように何もしていません。私が見逃しているのは、比較的単純なものでなければならないような気がします。何か助けはありますか?ありがとう!