从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>

图片BEL流更好地理解

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

如果你的问题是关于为什么你的input元素标签不工作：

在这种情况下，您需要给输入元素一个id，“color”。

语法

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