0

我创建了动态 html 按钮，我想为它们设置点击事件。这是我的 html 输出和代码：

   <td style="width:90px;">
<input type="button" class="btn_Yeni" id="btnYeni"></td>

$(".btn_Yeni").on("click", function () {
    alert('asd');
});

$(".btn_Yeni").trigger("click");

单击按钮后没有任何反应。你有什么建议吗？

4

5 回答 5

2

由于 html 按钮是动态添加的，因此您需要使用event delegation来注册事件处理程序，例如：

// New way (jQuery 1.7+) - .on(events, selector, handler)
$(document).on('click', '.btn_Yeni', function(event) {
     alert('asd'); 
});

更新

由于按钮已添加到表格单元格中，如您的 HTML 标记中所示，您可以执行以下操作：

$('#tableID').on('click', '.btn_Yeni', function(event) {
     alert('asd'); 
});

这会将您的事件附加到#tableID元素中的任何按钮，从而减少检查整个document元素树的范围并提高效率。

于 2013-11-05T07:15:30.763 回答
0

由于您有动态按钮，因此您需要使用事件委托。

仅使用 .on() 注册事件处理程序并没有使用事件委托，它具有使用事件委托的非常特定的格式。该事件应附加到页面中已存在的元素（如以下情况下的文档对象），然后必须将动态元素选择器作为第二个参数传递给该on()方法

$(document).on("click", ".btn_Yeni", function () {
    alert('asd');
});
于 2013-11-05T07:14:57.317 回答
0

这是使用动态元素时的方法。

$("body").on("click",".btn_Yeni", function () {
    alert('asd');
});

它是如何完成的：

处理程序未附加到元素本身（因为它在注册时不存在） - 因此您将处理程序附加到body元素。并通过事件冒泡 - 当委托元素到达body （处理程序实际附加到的位置）时，它会被检查（反对）。

于 2013-11-05T07:15:26.710 回答
0

我整理了一个小提琴供您探索动态按钮添加和使用 on 方法进行事件委托。

<ul id="btnCollection">
    <li>
        <input type="button" class="btn_Yeni" value="Your Button" />
    </li>
</ul>

var button = $("#btnCollection:last-child").html();

$("#btnCollection").on("click", ".btn_Yeni", function (event) {
    alert("Adding another button");

    $("#btnCollection").append(button);

});

http://jsfiddle.net/itanex/yak7c/

于 2013-11-05T07:34:49.453 回答
0

DEMO在此处输入链接描述

$(document).on("click", ".btn_Yeni", function () {
    alert('asd');
});
function addrow(){
 var $tr = $("#baserow")   
 var $clone=$tr.clone();
 $tr.after($clone);    
}
于 2013-11-05T07:35:38.193 回答