Question

我有一个表单，我试图用jQuery改变。基本上，我的表单有两个元素，我需要更改每个元素中第一个选项的值。但是，有一个“添加更多”选项，它使用AJAX动态生成另一个也需要更改的元素。这个添加更多按钮可以无限次点击。

现在我有这个：

$(document).ready(function(){
  $("#myname-0-field option:first").val("None");
  $("#myname-1-field option:first").val("None");
});

这很好用，但是一旦单击“添加更多”按钮，我就会有更多元素称为“＃myname-2-field”，“＃myname-3-field”，“＃myname-4-field”等这些显然不受在我的jQuery中添加另一行的影响，因为文档在添加时已经加载了。

所以真正的问题是，有人能指出我正确的方向编写一个函数，可以在添加新元素并对其进行更改时做出反应。如果可能的话，我也在寻找要注意的功能，并寻找“＃myname-X-field选项：首先”以获得整洁。

Answer 1

使用live（）函数

然后使用每个功能设定值

Answer 2

从jQuery API查看live函数

也许你可以为你的元素添加类，这样找到特定元素会更容易，并且不会将事件添加到其他类似的元素。

在示例中，我有一个带有类

的Li

$('li.myClass').live('click', function() {
    $(this).val(); // this is the getter for clicked value
    $(this).val("some_value_here"); // this is the setter for clicked value
});

现在您可以添加更多元素（具有 myClass 类）并且它将有一个点击事件。

顺便说一下。如果您知道所有元素都在某个容器内（例如div），那么您可以使用delegate编写更高效的jQuery。

$('#container_id').delegate('li.myClass', 'click', function () {
});

这样效率更高，因为它只在“容器”下查找新元素而不是整个DOM结构。

递归jQuery函数来修改选择选项值

2 个答案: