的innerHTML清除數值，同時增加muliple文本框

我下面this link 的innerHTML清除數值，同時增加muliple文本框

添加動態文本框。但是我的問題是，當我在第二個文本框中插入值時，然後按下下一個文本框的按鈕時，第二個框中的值將被刪除。所以我不能使用提交表單。有什麼方法可以解決它嗎？

HTML

<table style="width:500px;height:auto;"> 
<tr> 
<th>Code-1</th> 
<td><input type="text" name="code1" id="code"></td><td><input type="button" value="Add New Code" onClick="insert()"></td> 
</tr> 
<tr> 
<th>Custom Markup-1</th><td> 
<input type="text" name="markup1" id="markup"></td></tr> 
<tr><th>Vendor-1</th><td> 
<select id="v" name="v1"> 
<option value="0">Please Select..</option> 
<? 
while($v= mysql_fetch_array($vendor)) 
{ 
    echo "<option value=".$v['id'].">".$v['name']."</option>"; 
} 
?> 
</select></td> 
</tr> 
</table>

<script language="javascript"> 
var i = 1; 
function insert() 
{ 
new_div.innerHTML = new_div.innerHTML +"<tr><th>Code-"+(i+1)+"</th><td><input type='text' id='code"+(i+1)+"' name='code"+(i+1)+"'></td></tr>"; 
new_div.innerHTML = new_div.innerHTML +"<tr><th>Custom Markup-"+(i+1)+"</th><td><input type='text' name='markup"+(i+1)+"'/></td></tr>"; 
new_div.innerHTML = new_div.innerHTML +"<tr><th>Vendor-"+(i+1)+"</th><td><select id='v'+i name='v"+(i+1)+"'><option value='0'>Please Select..</option><?php while($v= mysql_fetch_array($vendorInfo)){?><option value='<?php echo $v['id']; ?>'><?php echo $v['name']; ?></option><?php }?></select></td></tr>"; 
new_div.innerHTML = new_div.innerHTML +"<tr><td><hr></td><td><hr></td></tr>"; 
//document.getElementById('code2').value=document.getElementById('code2').value; 
i++; 
} 
</script>

來源

2013-11-15 NewPHP

發佈您的代碼。你在分配innerHTML還是連接它？ –

這是與上述鏈接的答案相同的代碼。我正在分配innerhtml，而不是連接。所以我認爲，當我按下按鈕innerhtml將刷新 – NewPHP

但是，在這裏看到的代碼比跟隨鏈接更容易。如果您正在分配innerHTML，它將替換已經存在的所有內容。使用innerHTML + = [動態東西] –

試試這個上：

<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <script> 
      var txtBId=1; 
      function addTB(){ 
       var div=document.getElementById("tbSet"); 
       var txt=document.createElement("input"); 
       txt.setAttribute("type","text"); 
       txt.setAttribute("id","tb"+(txtBId++)); 
       // div.innerHTML=div.innerHTML +"<br>"; <------------------ 
       var br=document.createElement("br"); 
       div.appendChild(br);   
       div.appendChild(txt); 
      } 
     </script> 
    </head> 
    <body> 
     <form id="myform"> 

      <div id="tbSet"> 

      </div> 
      <input type="button" value="New TextBox" onclick="addTB();"> 
      <input type="submit" value="Submit"> 

     </form> 

    </body> 
</html>

來源

2013-11-15 05:40:01 SeeTheC

感謝您的回覆。我仍然有代碼問題。如果我添加了三個或更多文本框，數據將在提交之前從所有文本框中刪除 – NewPHP

刪除註釋行。見上面的代碼。 – SeeTheC

查看上面的代碼，它現在可以用於任何文本框。 – SeeTheC

DONOT通過innerHTML的添加文本框，。如果添加它，3個數據將被刪除。做到這一點bu createElement，然後添加孩子。

function addTB(){ 
       var div=document.getElementById("tbSet"); 
       var txt=document.createElement("input"); 
       txt.setAttribute("type","text"); 
       txt.setAttribute("id","tb"+(txtBId++));     
       var br=document.createElement("br"); 
       div.appendChild(br);   
       div.appendChild(txt); 
    }

來源

2013-11-15 06:00:30 SeeTheC

感謝您的回答。我不熟悉createElement。讓我試試看。我們可以用這個createElement創建表，透明度降落盒嗎？ – NewPHP

createElement可用於任何Html標記。 – SeeTheC

對於下拉顯示：

var slId=1; 
      function options(name,value){ 

       var o=document.createElement("option"); 
       o.setAttribute("value",value); 
       o.innerHTML=name; 
       return o; 

      } 
      function addDropDown(){ 
        var div=document.getElementById("tbSet"); 
       var sl=document.createElement("select");     
       var o=options("Hello","hi");    
       sl.setAttribute("id","sl"+(slId++)); 
       sl.appendChild(o);     
       div.appendChild(sl); 
      }

來源

2013-11-15 06:14:00 SeeTheC

我可以使用我的PHP代碼（while循環）進行動態下拉嗎？ – NewPHP

是的，你可以做到。 – SeeTheC

如果您不介意，請告訴我如何處理while循環？我正在尋找它。但沒有得到確切的答案！ – NewPHP

的innerHTML清除數值，同時增加muliple文本框

回答

相關問題