J'essaie d'ajouter des zones de texte dans la liste ordonnée sur un bouton en utilisant JavaScript et incrémenter le nom d'identification en ajoutant la zone de texte

Question

J'ai essayé d'utiliser document.createElement, qui fonctionne bien pour ajouter du textbox mais je ne peux pas incrémenter le nom. Je l'utilise dans une application de métro.

Answer 1

<form> 
    No. of lines: 
    <input type="text" id="number" value="0"/> 
    <br/> 
    <input type="button" id="button" value="Add Line" /> 
</form> 
<div> 
    <ol id="linedata"> 
    </ol> 
</div> 
document.getElementById('button').addEventListener("click", incrementValue); 
function incrementValue() { 
    var value = parseInt(document.getElementById('number').value, 10); 
    value = isNaN(value) ? 0 : value; 
    value++; 
    document.getElementById('number').value = value; 
    var list = document.createElement('li'); 
    var box = document.createElement('input'); 
    box.type = 'text'; 
    box.id = 'line' + value; 
    box.placeholder='Line ' + value; 
    list.appendChild(box); 
    document.getElementById("linedata").appendChild(list); 
} 

Answer 2

function textBox(noOfInputTag){ 

    noOfInputTag = noOfInputTag*1; // Convert to Number 
     //noOfInputTag is used to get total textbox you want to create         
    for(var i = 0; i <= noOfInputTag; i++){ 
     var textbox = document.createElement('input'); 
     textbox.type = 'text';`enter code here` 
     textbox.id = 'textBox_' + i; // As number of textbox increases id get incremented 
     document.body.appendChild(textbox); 
    } 
} 
textBox(2);