jquery - jquery：将新的动态元素绑定到已定义的函数

Question

在我的页面上我有

$(function()
{
  $('.load').click(function()
  { 
  var val =  $(this).attr('value'); //get value of the button that called this function
  //do stuff});
});

以及在初始 html 上定义的一些按钮：

<input type="button" value="getData1" class="load" />

如果我稍后添加更多相同类的按钮，并希望它们以相同的方式操作，我如何将它们绑定到原始功能？

我在看，.on但它似乎定义了一个新功能。我希望有一种方法可以使用已经定义的方法。

或者我应该单独定义函数并从两个地方调用它？如果是这样，我如何将调用该函数的元素作为参数传递？

任何帮助将不胜感激。

Answer 1

on正如你所提到的，这就是目的。On 允许您将侦听器附加到包含要监视的元素的文档部分。

$(document).on('click', '.load', function() { 
    var val =  $(this).attr('value');
});

使用document不是最好的，因此理想情况下，您应该在其中放置一些选择器，以匹配围绕所有按钮的元素，包括当前和未来。

document调用后添加到内部的按钮也on将触发此处理程序，即使它们是稍后添加的。