IDを持つボタンをクリックしたときに、私は現在、テキスト入力フィールドのクローンを作成するために、このコードを使用してい回

Question

のクローン数nを実行すると、btnAdd

$(document).ready(function() { 
      $('#btnAdd').click(function() { 
       var num  = $('.clonedInput').length; 
       var newNum = new Number(num + 1); 

       var newElem = $('#input' + num).clone().attr('id', 'input' + newNum); 

       newElem.children(':first').attr('id', 'name' + newNum).attr('name', 'name' + newNum); 
       $('#input' + num).after(newElem); 
       $('#btnDel').attr('disabled',''); 

       if (newNum == 25) 
        $('#btnAdd').attr('disabled','disabled'); 
      }); 

私は何をしたい、別のボタンを押すことができるようです特定の数の複製されたテキストフィールドを追加しますが、IDは名前+ Nに変更します。

私はボタンを作成してfxを作成できます。 5つのテキストフィールドに入力し、それらに所定の値を入力します。

今私は5つの合計4つのテキストフィールドを作成し、次にテキストフィールドを変更するために、別のボタンで関数を呼び出す必要があります。

正しい方向のポイントは高く評価されます。私はコメントで使用

---

例：

のは、私はあなたが入力私は1つの入力ボックス

<div id="input1" style="margin-bottom:4px;" class="clonedInput"> 
<input type="text" name="name1" id="name1" placeholder="Port" /> 
</div> 

で始まる名前

のリストをすることができ、サイトを持つようにしたいとしましょう

次に、ユーザーがさらに入力ボックスを追加できるようにします。だから私はOPのクローンコードを使用する

これは、ユーザーが手動で必要なすべての名前を追加することができます。

しかし、私は、ユーザーが事前に選択したリストから選択できるようにしたい、サッカーチームのすべての名前のリストを言うことができるようにしたい。

私はfxを作成するボタンを押すことができます。 11個の入力ボックスを入力し、フットボールチームの11個の名前すべてをボックスに記入します。

function Input() { 
       $('#name1').val(‘John’) 
       $('#name2').val(’Steve’) 
       $('#name3').val(‘Maria’) 
       $('#name4').val(‘Ida’) 
      } 

をしかし、ユーザーが入力ボックスの十分なクローンを作成していない場合、これは先ほど作成したものを記入：。私はこのコードを使用している。これを行うために

Answer 1

私はあなたが望むふるまいを理解したと思います。それは基本的にあなたが値としていくつかのランダムな名前を持つdivブロックの入力を追加します。

var names = ["Chris", "Jimmy", "George", "Martin", "Keith"]; 
 

 
function createInputs(numberOfInputs, blockId) { 
 
    var i = 0; 
 
    var inputBlock = $("#" + blockId); 
 
    
 
    inputBlock.empty(); 
 
    
 
    while(i < numberOfInputs && i < names.length) { 
 
    inputBlock.append($('<input type="text" name="name" id="name'+ i + '"/>').val(names[i])); 
 
    i++; 
 
    } 
 
}

input { 
 
    display: block; 
 
    margin: 5px 0; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 
<button onclick="createInputs(3, 'input1')">Create 3 random inputs</button> 
 
<div id="input1" style="margin-bottom:4px;" class="clonedInput"> 
 
    <input type="text" name="name1" id="name1" placeholder="Port" /> 
 
</div> 
 

 
<button onclick="createInputs(5, 'input2')">Create 5 random inputs</button> 
 
<div id="input2" style="margin-bottom:4px;" class="clonedInput"> 
 
    <input type="text" name="name1" id="name1" placeholder="Port" /> 
 
</div>