如何循環輸入類型文本？

如何循環輸入類型文本，使其具有自己的唯一屬性，例如。名稱，價值。我的意思是，例如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

如何循環輸入類型文本？

回答

相關問題