Добавление ярлыка или текста для добавления текстового поля из javascript

Question

Извините, если это обсуждалось ранее, но все они не работают для меня. Как добавить ярлык или текст, как добавление текстового поля? Предполагается, что он выглядит как первый текстовый файл.

Вот мой HTML код

<label for="color" class="control-label col-xs-4"><p class="left">Color/s</p></label> 
 
\t <div class="col-xs-7"> 
 
\t \t \t \t \t \t \t \t \t \t \t \t 
 
<input name="color" class="req" id="theValue" autocomplete = "off" /> 
 
\t <p><a href="javascript:addElement()" >Add Color</a></p>  
 
\t <div id="myDiv"></div> 
 
\t <div style='clear: both;'></div>

и вот Javascript для добавления текстового поля

<script language=javascript> 
 
     function addElement() { 
 
     var ni = document.getElementById('myDiv'); 
 
     var numi = document.getElementById('theValue'); 
 
     var num = (document.getElementById('theValue').value -1 + 2); 
 
     numi.value = num; 
 
     var newdiv = document.createElement('div'); 
 
     var divIdName = 'my'+num+'Div'; 
 
     newdiv.setAttribute('id',divIdName); 
 
     newdiv.innerHTML = '<input type=text id=' + num + ' ' + num + ' class= "req"><a href="javascript:remove('+divIdName+')">Remove</a>'; 
 
     ni.appendChild(newdiv); 
 
     } 
 

 

 
     function remove(dId) { 
 
     var ni = document.getElementById('myDiv'); 
 
     ni.removeChild(dId); 
 
     } 
 

 
     </script>

Изображение бель вл для лучшего понимания

Answer 1

Я не уверен, что это то, что вы ожидали, но попробовать что-то вроде этого:

<script language=javascript> 
    function addElement() { 
    var ni = document.getElementById('myDiv'); 
    var numi = document.getElementById('theValue'); 
    var num = (document.getElementById('theValue').value -1 + 2); 


    numi.value = num; 
    var divIdName = 'my'+num+'Div'; 
    var newdiv = document.createElement('div'); 
    var column = document.createElement('div'); 
    var label = document.createElement('label'); 
    var remove = document.createElement('a'); 
    var input = document.createElement('input'); 
    column.setAttribute('class', 'col-xs-7'); 
    input.setAttribute('type','text'); 
    input.setAttribute('id', num + ' ' + num ) 
    remove.setAttribute('href','javascript:remove('+divIdName+')'); 
    remove.innerHTML = 'Remove'; 
    label.innerHTML = 'text'; 
    label.setAttribute('for', num + ' ' + num); 

    newdiv.setAttribute('id',divIdName); 


    ni.appendChild(newdiv); 

    newdiv.appendChild(label); 
    newdiv.appendChild(column); 
    column.appendChild(input); 
    column.appendChild(remove) 
    } 


    function remove(dId) { 
    var ni = document.getElementById('myDiv'); 
    ni.removeChild(dId); 
    } 

    </script> 

Answer 2

Если ваш вопрос о том, почему метка для элемента ввода не работает:

В этом случае необходимо ввести элемент ввода «цвет».

Синтаксис

<label for="element_id">label</label>