如何循环输入类型文本？

如何循环输入类型文本，使其具有自己的唯一属性，例如。名称，价值。我的意思是，例如name =“text1”，name =“text2”,.类似的东西。这是我的代码。谢谢:)如何循环输入类型文本？

<HTML> 
    <HEAD> 
    <TITLE></TITLE> 
    <SCRIPT language="javascript"> 
    function add(type) { 

     //Create an input type dynamically. 
     var element = document.createElement("input"); 

     //Assign different attributes to the element. 
     element.setAttribute("type", "text"); 
     element.setAttribute("value", "typhere"); 
     element.setAttribute("name", "txtbox"); 

     var btns = document.createElement("input"); 


     btns.setAttribute("type", "button"); 
     btns.setAttribute("value", "delete"); 
     btns.setAttribute("name", "dlete"); 


     var foo = document.getElementById("fooBar"); 

     //Append the element in page (in span). 

       foo.appendChild(element); 
       foo.appendChild(btns); 
       var br = document.createElement("br"); 
       foo.appendChild(br); 

    } 
    </SCRIPT> 
    </HEAD> 
    <BODY> 
    <FORM> 
    <H2></H2> 

    <BR/> 


    <INPUT type="button" value="Add" onclick="add(document.forms[0].value);"/> 

    <span id="fooBar"><br/></span> 

    </FORM> 
    </BODY> 
    </HTML>

来源

2013-11-05 user2901740

所以，你的意思是每次有人点击该按钮，附加功能被执行，每次你想它使用不同的序列号为创建的元素的ID？ – JAL

首先，我会将JavaScript从HTML标记中提取出来，这样可以使它更加强大。然后将其绑定到输入的'click'事件。 – JAL

你可以那样做：

var inputId = 0; 

function add(type){ 
    // do the stuff you have to do with inputId 
    // input.setAttribute("name", "text" + inputId); for example 
    inputId++; 
}

如果你不想污染全局命名空间，你可以这样做：

(function(window){ 
    var inputId = 0; 

    window.InputManager = { 
    add : function(type){ 
     // do tuff with inputId 
     // input.setAttribute("name", "text" + inputId); for example 
     inputId++; 
    } 
    }; 
})(window);

然后

<input type="button" value="Add" onclick="InputManager.add(document.forms[0].value)"/>

来源

2013-11-05 07:32:57 dooxe

您的第一个解决方案是正确的，但很抱歉，我在阅读本文之前能够解决我的问题。我还没有尝试过你的第二个解决方案:) – user2901740

没有问题，我很高兴你的脚本现在可以工作;）我的第二个解决方案与第一个解决方案非常相似，但隐藏变量'inputId'从全局命名空间，并把'add'函数放入一个新的函数（* InputManager *），所以这个函数也不会出现在全局名称空间中。 – dooxe

 var i=1; 
    function add(type) { 

    //Create an input type dynamically. 
    var element = document.createElement("input"); 

    //Assign different attributes to the element  
    element.setAttribute("type", "text"); 
    element.setAttribute("value", "typhere"+i); 
    element.setAttribute("name", "txtbox"+i); 

    var btns = document.createElement("input"); 


    btns.setAttribute("type", "button"); 
    btns.setAttribute("value", "delete"+i); 
    btns.setAttribute("name", "dlete"+i); 
    i++;

使用变量i递增值。

来源

2013-11-05 07:16:24 Govan

嗨，我已经这样做了，但它不会增加变量。我不知道为什么..hmm – user2901740

它不增加变量，因为例如“text1”对于'input'元素不是有效的'type'属性。而且，这里没有循环。除非我在这里严重误解了这个问题。 – Trojan

这是javascript ...有静态关键字吗？ – JAL

试试这个：

var counter=1; 
function add(type) { 

    //Create an input type dynamically. 
    var element = document.createElement("input"); 

    //Assign different attributes to the element. 
    element.setAttribute("type", "text"); 
    element.setAttribute("value", "typhere"+counter); 
    element.setAttribute("name", "txtbox"+counter); 

    var btns = document.createElement("input"); 


    btns.setAttribute("type", "button"); 
    btns.setAttribute("value", "delete"); 
    btns.setAttribute("name", "dlete"); 


    var foo = document.getElementById("fooBar"); 

    //Append the element in page (in span). 

      foo.appendChild(element); 
      foo.appendChild(btns); 
      var br = document.createElement("br"); 
      foo.appendChild(br); 
      counter++; 

}

演示：http://jsfiddle.net/kLJWW/

来源

2013-11-05 07:33:31

如何循环输入类型文本？

回答

相关问题