如何獲取動態生成的多個文本框的值？
[英]How to get values of multiple textboxes generated dynamically?
問題描述
我有一個名為“ AddTextArea”的按鈕，單擊后會得到新的文本區域，但是如何獲取在新文本區域中輸入的值？
我嘗試過這樣-
var x= document.getElementById("div_quotes").value;
但它不起作用。 由於我是JS新手，請提供幫助，謝謝。
<html> <head> <script type="text/javascript"> function addTextArea(){ var div = document.getElementById('div_quotes'); div.innerHTML += "<textarea name='new_quote[]' />"; div.innerHTML += "\\n<br />"; } </script> </head> <body> <form method="post"> <!--<input type="text" name="text_new_author" /><br />--> <div id="div_quotes"></div> <input type="button" value="Add Text Area" onClick="addTextArea();"> <input type="submit" name="submitted"> </form> </body> </html>
2 個解決方案
解決方案1
0 已采納 2017-03-30 13:32:06
var x= document.getElementById("div_quotes").value;
上面的代碼將不起作用，因為div_quotes是div且div沒有value屬性。
您將不得不在該div中搜索textareas。
樣品
function addTextArea() { var div = document.getElementById('div_quotes'); div.innerHTML += "<textarea name='new_quote[]' />"; div.innerHTML += "\\n<br />"; } function validate(){ var tas = document.querySelectorAll('#div_quotes textarea[name="new_quote[]"]') for(var i = 0; i< tas.length; i++){ console.log(tas[i].value) } }
<form method="post"> <!--<input type="text" name="text_new_author" /><br />--> <div id="div_quotes"></div> <input type="button" value="Add Text Area" onClick="addTextArea();"> <input type="button" name="submitted" onclick="validate()" value="Validate"> </form>
版本2
現在，如果您在上面的示例中注意到，如果鍵入然后添加另一個textarea，它將刷新以前的textarea的值。 這是因為您正在設置.innerHTML += ... 這將再次破壞並重新創建所有元素。 您應該使用document.createElement
function addTextArea() { var div = document.getElementById('div_quotes'); var wrapper = document.createElement('div') var ta = document.createElement('textarea'); ta.name = "new_quote[]" wrapper.append(ta); div.append(wrapper) } function validate(){ var tas = document.querySelectorAll('#div_quotes textarea[name="new_quote[]"]') for(var i = 0; i< tas.length; i++){ console.log(tas[i].value) } }
<form method="post"> <!--<input type="text" name="text_new_author" /><br />--> <div id="div_quotes"></div> <input type="button" value="Add Text Area" onClick="addTextArea();"> <input type="button" name="submitted" onclick="validate()" value="Validate"> </form>
解決方案2
0 2017-03-30 13:33:18
您可以將CSS類添加到生成的新文本區域，並使用獲取數據
var x = document.getElementsByClassName("dynamicTxtArea")
我已經將該類添加到正在動態生成的Text區域中。 請檢查下面的代碼。
<html> <head> <script type="text/javascript"> function addTextArea(){ div.innerHTML += "<textarea name='new_quote[]' class='dynamicTxtArea'/>"; div.innerHTML += "\\n<br />"; } </script> </head> <body> <form method="post"> <!--<input type="text" name="text_new_author" /><br />--> <div id="div_quotes"></div> <input type="button" value="Add Text Area" onClick="addTextArea();"> <input type="submit" name="submitted"> </form> </body> </html>
如何從asp.net中動態生成的html文本框中獲取值
[英]How to get the values from dynamically generated html textboxes in asp.net
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.