動態創建複選框沒有響應jQuery事件

我已經創建了動態複選框使用jQuery的基礎上從Web服務的數據。動態創建複選框沒有響應jQuery事件

var checkbx = '<td><input type="checkbox" class="select_ticket" data-id="'+ newjsondata[i].id +'"/></td>'; tr.append(checkbx);

當我點擊複選框沒有任何反應，換句話說，事件不響應。

function test() { 
    console.log('okokok'); 
    var id = $(this).data("id"); 
    alert(id); 
} 
$(".select_ticket").on("click", test);

我的事件嘗試點擊和改變事件沒有任何成功。

有人能幫助我理解我犯了什麼錯誤。

來源

2017-06-15 Krish

你需要表現出更多的代碼。您可以在添加事件之前定義複選框。您將複選框附加到一個看起來像html的行中，但您的HTML看起來像JS。在答案可能發生之前需要很多 –

您可以添加$（「.select_ticket」）.on（「click」，test）;在tr.append之後，問題是你將再次註冊所有項目的事件。您可以先執行$（「.select_ticket」）.off（「click」）以跳過此問題，然後再次單擊所有項目的註冊。無論如何，Quagaar給出的答案是最好也是最簡單的選項 – hamboy75

如果html呈現沒有錯誤，那麼它是點擊處理程序需要[委託事件]（http://api.jquery.com/on/#direct-and-delegated-事件），正如Quagaar已經回答的那樣。 – yezzz

點擊處理程序只註冊註冊時存在的複選框。更改你這樣的處理程序註冊也註冊新添加到DOM複選框：

$('body').on('click', '.select_ticket', test);

（你應該更嚴格的選擇交換「身體」）

來源

2017-06-15 20:03:41 Quagaar

我會推薦$（document）.on（'click'，'.select_ticket'，test）; – Woodrow

@Woodrow爲什麼要文件？通常我傾向於儘可能縮小選擇器的範圍。我真的不知道jQuery如何在這裏工作，但我認爲，觀察整個文檔的變化比僅觀看（或多或少）DOM的一小部分更昂貴。 – Quagaar

我同意縮小選擇器，如果可以的話，我只是知道文檔派上用場，如果由於某種原因，您的點擊事件處於如此動態的狀態，以至於很難縮小綁定它的元素的範圍。 – Woodrow

動態創建複選框沒有響應jQuery事件

回答

相關問題