Question

我有以下jquery：

$(".order_submit").click(function() {
  alert( "Alert" );
  console.log("TEST")
});

当我将该功能放入控制台时，我得到以下内容：

$(".order_submit").click(function() {
  alert( "Alert" );
  console.log("TEST")
});
[
<input id="order_button" type="button" class="order_submit" value="Submit Order">
]

该按钮是通过此javascript：

创建的

var total = 0;
    for (var x in prodData) total += prodData[x].price * prodData[x].quantity
    total = Math.round(total * 100) / 100
    var subtotal = '<tr><td><input id="order_button" type="button" class="order_submit" value="Submit Order"></td><td>Subtotal</td><td>$' + total + '</td></tr>';

这与它有关吗？

Answer 1

在DOMReady之后，当按钮添加到页面时，您需要使用委托事件：

$(document).on('click', '.order_submit', function() {
    alert('Alert');
    console.log('TEST')
});

请注意，为了获得最佳性能，您应该将示例中的document更改为页面加载时DOM中最近的元素。我想这将是subtotal附加到的表。

Answer 2

事件处理程序仅绑定到当前选定的元素;它们必须存在于您的代码进行事件绑定调用时的页面上。

您需要将Event delegation用于动态生成的元素

委托事件的优势在于它们可以处理来自稍后添加到文档的后代元素的事件。

一般语法

$(document).on(event, selector, eventHandler);

理想情况下，您应该使用最近的静态容器替换document以获得更好的性能。

代码的

$(document).on('click',".order_submit", function() {
  alert( "Alert" );
  console.log("TEST")
});

Answer 3

你需要的是委托coz按钮是动态创建的

$（document）.on（＆＃39; click＆＃39;，＆＃34; .order_submit＆＃34;，function（）{ 警报（＆＃34;警报＆＃34;）; 的console.log（＆＃34; TEST＆＃34） }）;

了解更多信息： -

http://learn.jquery.com/events/event-delegation/

Answer 4

作为@A。 Wolff说您应该委托事件，并且您可以使用jquery， .on（）的 .on（）或 .delegate（）功能之一对于旧版本的jQuery 1.7+和 .delegate（），请看一下这段代码：

$("table").on("click", ".order_submit", function() {
  alert( "Alert" );
  console.log("TEST")
});

您可以在此处找到完整的代码http://jsfiddle.net/gUY4V/

Jquery .click赢得了控制台日志或警报

4 个答案: