2012-10-26 29 views
1

我在我的應用程序中使用jQuery UI標籤。最初,tabpane是空的。標籤是動態創建的。每個標籤默認都有一個保存按鈕。請看下面的代碼。選項卡顯示正常。如果我有多個選項卡,則會出現問題。例如:如果我有3個標籤,每個標籤上有3個保存按鈕。點擊事件僅從第一個標籤觸發。事件不會從任何其他選項卡觸發。只有當我點擊第一個標籤中的保存按鈕時,我纔會收到來自「保存」和「你好」的提醒。當我點擊第二個和第三個標籤中的保存按鈕時,它不會執行任何操作。你能告訴我我是否缺少任何東西嗎? 謝謝。事件不在JQuery UI標籤中觸發

MyModel = Backbone.Model.extend({ 

    defaults: { 
     name: "Name", 
     contents: "<div><table><tr>"+ 
       "<td><button id='save' value='Save'>Save</button></td>"+ 
       "</tr></table></div>" 

    } 

    }); 



MyView = Backbone.View.extend({ 


     initialize: function() { 
     _.bindAll(this, 'render'); 
     }, 
     events: { 
      "click #save" : "save" 
     }, 
     save: function(){ 
     alert("from save"); 

     }, 
     render: function() { 
     // add the actual content 
     $("#tabs").append('<div id="tab_' + this.model.cid + '">' 
      + this.model.get('contents') 
      + '<br /><br /><br />' 
      ); 

     // ask jQueryUI to add the tab to the bar 
     $("#tabs").tabs("add", "#tab_" + this.model.cid, this.model.get('name')); 
     $("#save").live("click", function(){ 
      alert("hello"); 
     }); 
     return this; 
     } 
}); 


var view = new MyView({ 
       model: model, 
       }); 
view.render(); 

回答

0

ID應該是唯一的。我的猜測是,你正在創建多個#save按鈕。嘗試將其改爲課堂。

在附註中,live()已被棄用。如果你使用的是新版本的jQuery,我建議使用on()方法。一些僞代碼:

$("#container").on("click", ".savebutton", function(){ 
     alert("hello"); 
});