如何使用 jquery 从动态生成的表单元素中获取元素 ID？答案

【问题标题】：How to get element Id from dynamically generated form elements with jquery?如何使用 jquery 从动态生成的表单元素中获取元素 ID？
【发布时间】：2019-01-31 11:32:32
【问题描述】：

为了尝试这个概念，我正在做一个非常简单的测试。

我得到了一个从一开始就显示了一些文本输入的表单。当我点击一个字段时，我想捕获它的 Id，并为输入文本添加一个值。

$(document).ready(function() {
    $('input').focus(function() {
        var currentId = $(this).attr('id');
       $("#"+currentId).val('blah');
    });
});

这适用于初始字段，但它停止使用使用 ajax 调用添加的字段。

诀窍是，用户可以点击任何字段，但直到他们点击我才知道是哪个字段。我的 ID 如下所示：

experience0-CompanyName //(original one)
experience[n]-CompanyName

（[n] 部分也用于对表单中的字段进行排序，因为元素按经验、教育技能等进行分组......

我怎样才能做到这一点？

【问题讨论】：

标签： jquery dynamic-forms

【解决方案1】：

一个简单的改变：

$(document).ready(function() {
    $('input').live("focus", function() {
        var currentId = $(this).attr('id');
       $("#"+currentId).val('blah');
    });
});

.focus 仅绑定到调用时存在的元素。 .live() 将函数绑定到所有现有元素的事件，以及以后添加到 DOM 的任何元素。

【讨论】：

如本文档中所述，live() 不适用于某些事件。改为“点击”来修复它。（几乎相同的事件）我选择这个答案作为解决方案，因为它首先存在并且我确实需要获取 currentId 以供以后使用。感谢大家的帮助。你让我走上了正轨。

【解决方案2】：

以前的答案不再合适。他们依赖 jQuery.live，现在已弃用。在 jQuery 1.11 中，调用 jQuery.live 会产生错误。当前首选的解决方案是使用 jQuery.on 。上面的 jQuery.live 代码的实现如下。第二个参数，当前设置为“:input”，可以替换为符合您需要的选择器。

$( "body" ).on('focus', ":input", function() {
    var currentId = $(this).attr('id');
    $("#"+currentId).val('blah');
});

【讨论】：

【解决方案3】：

可以更简单（无需获取id和搜索）：

$(document).ready(function() {
    $('input').live('focus', function() {
        $(this).val('blah');
    });
});

【讨论】：

> 您好，感谢您的回答，但我只是尝试与下面的变体一起尝试，但没有成功。

【解决方案4】：

我相信你正在使用$("<someid>").focus(<function>)。这适用于已加载的文档，而不适用于添加的新标签。

Try using $("<someid>").live("focus", <function>);

还可以看看 jquery 网站。他们得到了非常好的带有示例的文档。现场查看http://api.jquery.com/live/

【讨论】：