Javascript JQuery触发一次按钮单击

我试图构建一个jQuery函数，当单击一个按钮时，它会创建七个输入字段。这应该只允许一次，而不是每次按下按钮

目前，我有下面的代码创建一个文本字段，但问题是每次按下按钮都会添加更多的文本字段。通过创建这些文本字段，我可以使用它们在数据库中添加记录。例如，通过单击添加按钮，将创建文本字段，用户可以输入信息

$("#addbutton").bind("click", function() { 
    var textarea = $('<input type="text" name="firstname">',);
    $('#textfields').append(textarea);
});

$（“#添加按钮”）.bind（“单击”，函数（）{
var textarea=$（''，）；
$（'#textfields'）。追加（textarea）；
});

---

谢谢

您可以使用

one（）

只启动一次事件处理程序，只需附加所需的按钮，我正在使用名称数组和

$.map

来创建它们

$("#addbutton").one("click", function() {

     var buttons = [
         'firstname',
         'lastname',
         ..... etc
     ];

     $('#textfields').append(
         $.map(buttons, function(_name) {
             return $('<input />', { name : _name })
         })
     );
});

$（“#添加按钮”）.one（“单击”，函数（）{
变量按钮=[
“名字”，
“姓氏”，
等
];
$（'#textfields'）。追加(
$.map（按钮、函数（\u名称）{
返回$（''，{name:_name}）
})
);
});

var numText=1；
$（“#添加按钮”）。在（“单击”上，函数（e）{
e、 预防默认值（）；
numText++；
$（'#textfields'）。追加（''）；
如果（numText==7）
$（此）.off（'单击'）
});

根据我们在您评论中的聊天，您需要一个按钮：

单击后，它将创建七个输入字段并将它们附加到

#textfields

元素中

创建字段后，不允许该按钮再创建任何输入字段

基于这种解释，我设计了以下解决方案：

$（“#添加按钮”）。单击（函数（）{
对于（变量i=0；i<7；++i）{
$（'#textfields'）。追加（''）；
}
$（this.prop（“disabled”，true）；
});

点击我
正因为我不喜欢使用JQuery来完成如此简单的事情，下面是纯JavaScript的代码：

document.getElementById("btn").addEventListener("click", onClick, false);

function onClick() {
    var textfield, br;
    for(var i=0 ; i<7 ; i++) {
        textfield = document.createElement("input");
        br = document.createElement("br");
        textfield.id = "txt_"+i;
        document.getElementById("textFields").appendChild(textfield);
        document.getElementById("textFields").appendChild(br);
    }
    this.parentElement.removeChild(this);
}

document.getElementById（“btn”）.addEventListener（“单击”，onClick，false）；
函数onClick（）{
var textfield，br；
对于（var i=0；iOkay，那么你的问题是什么？让我们澄清一下：按钮被点击，七个输入字段被创建，再次点击按钮不会创建更多的输入字段。对吗？检查
。一个
方法只允许点击一次。@AGE再次点击按钮会创建更多的输入字段，我不希望出现这种情况。@bto.rdz L假设我创建输入字段，然后用另一个按钮提交数据，如果我想再次单击以输入新信息，会发生什么情况？请再次阅读问题。我如何识别每个文本字段以便从中获取数据？根据您给它们的名称确定目标
document.getElementById("btn").addEventListener("click", onClick, false);

function onClick() {
    var textfield, br;
    for(var i=0 ; i<7 ; i++) {
        textfield = document.createElement("input");
        br = document.createElement("br");
        textfield.id = "txt_"+i;
        document.getElementById("textFields").appendChild(textfield);
        document.getElementById("textFields").appendChild(br);
    }
    this.parentElement.removeChild(this);
}