我编写了一个脚本来克隆和重命名调查问卷中的输入字段。当我测试它时,我发现它还克隆了输入到字段中的信息。
我尝试使用 .val('') 和 .reset() 但它们都不起作用。经过一些研究后,我了解到这是因为我有输入字段的组合,并且它们并不完全适用于所有输入字段。因此,我决定创建一个“if”语句来更深入地研究,但这仍然没有清除克隆的输入。我检查了控制台,没有收到任何错误,所以我不知道出了什么问题。
这是代码
$("#p20_01_yes").click(function(){
var num = $('.clone_el').length,
newNum = new Number(num + 1),
clonedFieldset = $("#cloner").clone().prependTo("#page20");
clonedFieldset.attr('id',('cloner')+newNum).find("input, textarea, select, label, #cus_title").each(function() {
var item = $(this),
type = this.type,
tag = this.tagName.toLowerCase();
item.attr('name', item.attr('name') +newNum).attr('id', item.attr('id') +newNum);
$('#cus_title').text("Customer "+newNum);
if (type =='text'||tag=='textarea')
this.value='';
else if (tag=='select')
this.selectedIndex=0;
});
});
我正在克隆的部分有文本输入、文本区域和选择输入。我也会发布 HTML,但它超过了这些帖子的 30,000 个字符的限制。如果你想要一个 JSFiddle,我可以将一个放在一起,但考虑到我对 JQuery 和 Javascript 还很陌生,我想这可能只是我的语法。
这是 JSfiddle:https://jsfiddle.net/Optiq/ct2ju1cb/
最佳答案
您的脚本存在一些问题:
TL;DR
您正在创建的新元素正在被清空,您只是将它们添加到页面顶部(参见上面的#1),并且您以某种方式更改了错误的客户标题元素(#3),因此它只是看起来新元素没有被清空。解决这些问题是一个很好的起点,但这样做可能会发现其他问题(#2、#4)。
详细信息(不是所有错误的完整列表)
- 您将新项目放在前面而不是追加它们,因此它们会添加到页面顶部而不是底部
- 您没有正确推导
name
和id
新元素的属性。item.attr('name') +newNum
解析为NaN
,您可以通过检查浏览器的开发人员控制台中的新元素来查看。然后你就有了很多带有id="NaN"
的元素。这绝对不是你想要的 - 您正在克隆
#cusTitle
但不改变其id
,表示返回值$("#cusTitle")
将是未定义的。在我的浏览器中,结果返回值是第二个#cusTitle
,这不是我所期望的,也不是你想要的 - 您正在提供新的
name
一些原本没有的项目的属性(例如我检查的所有<label>
元素)
关于javascript - 如何使用 JQuery 清空克隆输入?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33600043/