1

好的，我可以生成一个带有表单代码的按钮

var temp = "<button type=\"button\" class=\"dynBtn\" id=\"anID\">Here!</button>";
$('#myDiv').append(temp).click(function(){
    window.alert("Hello! My id is " + this.id);
});

然后在运行时这并没有真正起作用，因为我得到的答案是 id 是“myDiv”。另一方面，我也尝试使用这样的东西：

$('#myDiv').append(temp).click(dynButtonClicked(this));

其中 dynButtonClicked 单独定义为

function dynButtonClicked (aButton) {
    window.alert("Hey, my id is " + aButton.id);    
};

但是，这样，在加载页面时单击按钮，id 是“未定义”，而且，无论我单击按钮多少次，我都没有收到进一步的警报（除了我在页面加载时收到的警报）。那么，我怎样才能做到这一点呢？

我想理想情况下，我想为运行时生成的所有按钮的类命名，然后单击其中任何一个按钮以在

$(document).ready(...)

功能。但是，请继续告诉我你的想法。事实上，稍后，通过交互，我可能想删除按钮或禁用它们。所以，我正在寻找一些强大的东西。提前感谢您的宝贵时间。

4

3 回答 3

5

以下是使用 jQuery 的方法：

var $button = $('<button/>', {
  type: 'button',
  'class': 'dynBtn',
  id: 'anID',
  text: 'Here!',
  click: function() {
    window.alert('Hello! My id is '+ this.id);
  }
});

$button.appendTo('#myDiv');
于 2013-09-28T22:51:24.893 回答
1

那是因为.append()不返回附加的元素，你可以.appendTo()在这种情况下使用：

$(temp).appendTo('#myDiv').on('click', function() {
    window.alert("Hello! My id is " + this.id);
});

如果要向 DOM 添加许多元素，最好使用事件委托。

$('#myDiv').on('click', '.appendedElement', fn);
于 2013-09-28T22:48:49.820 回答
0

使用 on()，这样做：

$(document).ready(function(){
  //in here you put the event for all elements with dynBtn class
  $(document).on("click",".dynBtn",function(){dynButtonClicked();});
});

function dynButtonClicked (aButton) {
    window.alert("Hey, my id is " + aButton.id);    
};

//and append the button anytime you want
var temp = "<button type=\"button\" class=\"dynBtn\" id=\"anID\">Here!</button>";
$('#myDiv').append(temp);
于 2013-09-28T22:48:55.257 回答