2015-10-13 146 views
0

很抱歉,如果之前曾討論過,但它們都不適合我。如何添加標籤或文本,就像添加文本框一樣?它假設看起來像第一個文本框。從javascript中添加標籤或添加文本框的文本

這裏是我的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流更好地理解

enter image description here

回答

0

我不知道那是你所期待的,但嘗試這樣的事情:

<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> 
+0

正如你可以在我的圖片上看到,在添加的文本有上沒有「色」的標籤,這是我的問題:( – Vista

0

如果你的問題是關於爲什麼你的input元素標籤不工作:

在這種情況下,您需要給輸入元素一個id,「color」。

語法

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

正如你可以在我的圖片上看到,在添加的文本框有沒有「顏色」的標籤,這是我的問題:( – Vista

+0

你的意思是「添加顏色」文本下的第一個輸入元素? – Eeroz