应用一个函数到一个克隆的字段(Jquery)

Apply a function to a cloned field (Jquery)

本文关键字:一个 字段 Jquery 函数 应用      更新时间:2023-09-26

我有一个包含1个选择选项和5个文本字段的表单。

我的第一个功能是当我选择一个特定的选项时,这5个文本字段将自动从数据库填充数据。

该函数特定于所选选项的ID。

我有另一个函数,当我点击"添加另一个"按钮时,它会克隆表单,并为每个文本字段生成一个新的ID。

问题是,当我点击添加另一个和第二个表单存在时,5个文本字段不会自动填充,因为自动填充功能仅针对原始ID。

如何解决这个问题?如何将自动填充功能应用于新生成的表单?请帮助。

给定形式:

<form method='post' name="form1">
    <select id='select'>
        <option value='1'>1</option>
        <option value='2'>2</option>
    </select>
    First Name: <input type='text' id='fname'>
    Last Name: <input type='text' id='lname'>
    Contact Number: <input type='text' id='cnumber'>
    Address: <input type='text' id='address'>
    E-mail Address: <input type='text' id='email'>
    <button type='button' id='addanother'>Add Another</button>
</form>

谢谢!

这将是很好的看到一个工作或非工作的例子,所以我可以提供一个不太粗糙的代码样本,而不是改变输入的ID,而只是使用父作为选择器,即:

$('select').on('change', function (e) {
     $(this).parent().find('#fname').val("Set Value");
     ....
});

尽管正如其他人建议的那样,您应该使用类名作为选择器而不是id(这意味着是唯一的)