HTMLで選択ボックスとテキストフィールドを動的に生成する方法

次のコードでは、ユーザーが[追加]ボタンを押すたびに選択ボックスとテキストフィールドを生成しようとしています。私が直面している問題は、別の名前の新しいテキストフィールドをどのように生成できるかということです。コードでわかるように、テキストボックスの名前はtext1です。たとえば、名前がtext2の新しいテキストボックスを生成するにはどうすればいいですか？HTMLで選択ボックスとテキストフィールドを動的に生成する方法

<html> 
<head> 
    <title></title> 
</head> 
<body> 
    <h1><center>Querying Social Media</center></h1> 
    <form> 
     <center> 
      <select> 
       <option value="Author">Author</option> 
       <option value="Mention">Mention</option> 
       <option value="Tag">Tag</option> 
      </select> 
      <input type="text" name="text1"> 
      <select> 
       <option value="And">And</option> 
       <option value="Or">Or</option> 
      </select> 
      <input type="button" value="Add" onclick="add(document.forms[0].element.value)"/> 
      <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", type); 
        element.setAttribute("value", type); 
        element.setAttribute("name", type); 

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

        //Append the element in page (in span). 
        foo.appendChild(element); 
       } 
      </SCRIPT> 
     </center> 
    </form> 
    <span id="fooBar">&nbsp;</span> 
</body> 
</html>

出典

2016-03-19 Nasser

は、あなたがテキスト3、text4、テキスト5のように一つだけのテキスト入力、すなわち、テキスト2または複数が必要ですので、に... – yusufshakeel

あなたはすべての3つのタイプと毎回のための3つのグローバル変数を使用すると、種類に応じて、グローバル実行可能に増分を行い、その後、（textbox_1、textbox_2、...）のようにテキストボックスの名前を設定すると呼ばれる機能を追加することができます。あなたはこのようにそれをしなければならない>

出典

2016-03-19 21:20:26 Asad

何を考えて：

function add(type, value, name) { 
 

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

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

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

 
    //Append the element in page (in span). 
 
    foo.appendChild(element); 
 
} 
 

 
add("input","someValue", "text2");

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

出典

2016-03-19 22:36:30 John

HTMLで選択ボックスとテキストフィールドを動的に生成する方法

答えて

関連する問題