添加或觸發事件後內部內容頁

Question

我有一個表上的鏈接編輯或刪除元素，該元素可以被過濾。我過濾並使用ajax獲取結果並獲取函數。從那以後，我加入（顯示器）上使用inner.html表中的結果，這裏的問題是，過濾元件上的鏈接後，無法正常工作，導致有這樣

dojo.ready(function(){ 

    dojo.query(".delete-link").onclick(function(el){ 
    var rowToDelete = dojo.attr(this,"name"); 
    if(confirm("Really delete?")){ 
....... 
} 

}); 

我需要觸發道場功能過濾後的事件，有什麼想法？

Answer 1

（我假設你正在使用的Dojo < = 1.5此處）。

簡單的回答是，你需要在你的dojo.ready提取代碼到一個單獨的函數，調用該函數在您的Ajax呼叫的末尾回調爲load()。例如，做這樣的函數：

var attachDeleteEvents = function() 
    dojo.query(".delete-link").onclick(function(el){ 
     var rowToDelete = dojo.attr(this,"name"); 
     if(confirm("Really delete?")){ 
      ....... 
     } 
    }); 
}; 

然後調用此函數都在dojo.ready，當你的Ajax調用完成：

dojo.ready(function() { attachDeleteEvents(); }); 
.... 
var filter = function(someFilter) { 
    dojo.xhrGet({ 
     url: "some/url.html?filter=someFilter", 
     handleAs: "text", 
     load: function(newRows) { 
      getTableBody().innerHTML = newRows; 
      attachDeleteEvents(); 
     } 
    }); 
}; 

這是快速的答案。另一件你可能想看的事情是事件代表團。在上面的代碼中發生的事情是，每一行都得到一個onclick事件處理程序。你也可以在表本身擁有一個單獨的事件處理程序。這意味着當您過濾表時，不需要將事件處理程序重新附加到新行。

在最近版本的Dojo，你可以從dojo/on得到一些幫助 - 沿着線的東西：

require(["dojo/on"], function(on) { 
    on(document.getElementById("theTableBody"), "a:click", function(evt) {...}); 

這將是對整個表身一個單一的事件處理程序，但只有你的事件監聽器會被要求點擊<a>元素。

因爲（我假設）你使用的是1.5或更低版本，所以你必須做一點不同。我們仍然只能得到整個表格主體的一個事件監聽器，但我們必須確保我們只對我們自己的<a>（或一個子元素）的點擊操作。

dojo.connect(tableBody, "click", function(evt) { 

    var a = null, name = null; 
    // Bubble up the DOM to find the actual link element (which 
    // has the data attribute), because the evt.target may be a 
    // child element (e.g. the span). We also guard against 
    // bubbling beyond the table body itself. 
    for(a = evt.target; 
     a != tableBody && a.nodeName !== "A"; 
     a = a.parentNode); 

    name = dojo.attr(a, "data-yourapp-name"); 
    if(name && confirm("Really delete " + name + "?")) { 
     alert("Will delete " + name); 
    } 
}); 

例子：http://fiddle.jshell.net/qCZhs/1/