Question

如果之前有人问过这件事，我很抱歉，但是我有点受约束。我正在创建一个JavaScript函数，当用户专注于特定的HTML文本输入时动态添加表单输入（因为我们可以选择接受多个值）。我认为这样做比从下拉菜单中选择所需的输入量更容易。

以下是我添加新表单输入的方法：

$("input[type=text]").filter(":regex(id, roe[0-9])").filter(":last").on("focus", function() {
    // Add in new elements here
}

当我刷新页面，并专注于ID为“roe0”的初始文本输入时，JQuery会根据我的需要生成一个新输入。但是，当我专注于新生成的输入时，没有任何反应。然后，我必须重点关注原始$(#roe0)输入以生成新的文本输入。

有谁知道这个解决方案？任何和所有的帮助将不胜感激！

Answer 1

它只会被应用一次并应用到最后一个元素。您需要将其重新应用于新创建的元素。使用jQuerys .one()事件绑定器这将是一个很好的情况。因为一旦事件第一次触发（一次），必须删除元素上的绑定。

Answer 2

嗯，问题是您正在选择一个元素（页面加载时的最后一个元素），并为其附加一个事件处理程序。然后没有其他任何事情，所以你创建的任何新元素都不会有事件处理。

我会做的是这样的事情：

function createNewElement(e) {
    var newElement = jQuery('<input />');
    // Whatever logic you have to append the new input and such
    newElement.one("focus", createNewElement);
}

$("input[type=text]").filter(":regex(id, roe[0-9])").filter(":last").one("focus", createNewElement);

这样，当您创建一个新元素时，您将相同的事件处理程序附加到它。

如另一个答案所述，最好使用one代替on。一旦执行一次，它将分离事件处理程序（这很好，因为新元素应该是现在具有事件处理程序的元素）

JQuery不更新：动态添加元素的最后一个过滤器

2 个答案: