onClick 添加输入字段 [关闭]答案

【问题标题】：onClick add input field [closed]onClick 添加输入字段 [关闭]
【发布时间】：2014-07-31 19:32:13
【问题描述】：

我想在每次单击按钮时在DIV #mainC 的中心添加一个透明的输入文本字段。

我试过用 jquery 做这个，但没有成功。

【问题讨论】：

【解决方案1】：

使用append():

$("#abc").click(function() {
    $("#main").append('<input type="text" />');
});

【讨论】：

【解决方案2】：

你的代码有很多问题：

您多次使用同一个 ID（ID 只能使用一次，类可以多次使用）。
从外部 JavaScript 源调用函数将导致函数无法运行。
您正在尝试在未加载 jQuery 时使用 jQuery
$('<input type="aText" id="aText">').appendTo('#main') 不是一个有效的 jQuery，而是尝试使用：$('#main').append('<input type="text" id="aText">');
aText 不是有效的输入类型属性值

【讨论】：

为什么$('<input ...>').appendTo('#main') 无效？当$() 将 HTML 作为参数时，它会创建一个 DOM 元素并为该元素返回一个 jQuery 包装器，该包装器具有 appendTo 方法。那么这段代码有什么问题呢？

【解决方案3】：

jsfiddle左上角没有选择库。尝试在那里选择 jquery。

【讨论】：

【解决方案4】：

使用append() 并尽量不要指定onclick 内联。您可以使用 jQuery when document is ready 注册事件。以这种方式注册方法是首选，因为您将逻辑与 HTML 分开（检查unobtrusive javascript）。

这是你最好的做法：

$('#abc').on('click', function(){
    $('#mainC').append('<input type="aText" id="aText">')
})

也检查jsfiddle

你的 jsFiddle 的问题也是没有选择 jQuery 脚本。

【讨论】：