正确重命名克隆的输入JQuery

Properly renaming cloned inputs JQuery

本文关键字：输入 JQuery 重命名      更新时间：2023-09-26

我正在尝试创建自己的克隆函数，该函数可以更改克隆输入的名称，以便PHP可以收集这些输入。

在W3C上，我发现了这个从构建的简单函数

$("button").click(function(){
$("p").clone().appendTo("body");
});

我对它进行了修改，克隆了一个具有多个输入的字段集，它成功了。我更进一步，试图让它重命名和整数化不同输入元素的name属性，现在它甚至不克隆字段。

这是我迄今为止所拥有的。

$("#p20_01_yes").click(function(){
var num     = $('.clonedInput').length,
newNum  = new Number(num + 1);
$("#cloner").clone($("input, textarea, select").each().attr('name'+newNum)).appendTo("#page20");
});

我只是想发布一个HTML片段，但我收到了一个警告，告诉我限制是30000个字符，所以这里有一个js fiddle可以显示所有内容。

https://jsfiddle.net/Optiq/krjztsm2/

我以这种方式构建JQuery，因为我认为在克隆函数内部进行重命名，然后将结果附加到页面上，而不是将结果附加在页面上，然后返回并将其与其他所有内容分离以进行深入挖掘更合适。。。我觉得这对电脑来说更有意义。这是正确的看待方式吗？

你已经很接近了。我不确定我的答案是否能完美地工作（因为JSFiddle非常混乱），但你可以在之后调整类和id。

你只需要把你的任务分成两部分：

  1. 克隆字段集
  2. 更新输入元素的名称（可能还有id？）

下面是一个如何工作的例子：

$("#p20_01_yes").click(function(){
    var num = $('.clonedInput').length,
    newNum = new Number(num + 1);
    var $clonedFieldset = $("#cloner").clone().appendTo("#page20");
    $clonedFieldset.find("input, textarea, select ").each(function() {
        var $item = $(this);
        $item.attr('name', $item.attr('name') + newNum);
    });
});
相关文章：