我有一个要求在点击按钮时添加文本框。 当我点击添加按钮时,将创建新文本框但是在文本框中先前输入的数据将被清除。我不想在单击添加按钮时清除文本框中的数据。 我怎么解决这个问题?
HTML
<tr id="div"></tr>
<tr>
<td>
<button type="button" class="btn btn-lg btn-info" onclick="generateRow();">Add</button>
</td>
</tr>
JS
function generateRow() {
var d=document.getElementById("div");
d.innerHTML+=" <input class='form-control' type='text' required autofocus name='year'/> ";
}
答案 0 :(得分:2)
你可以在javascript中使用这样的东西
function generateRow() {
var child="<input class='form-control' type='text' required autofocus name='year'/>";
document.getElementById("div").appendChild(child);
}
答案 1 :(得分:1)
使用jquery .append()
将div添加到现有内容
答案 2 :(得分:1)
function generateRow() {
var i=0,j=0;
var d=document.getElementById("div"),input,value;
//var m=document.getElementById("div");
var x=new Array(50);
while (i!=d.childNodes.length/2)
{
if (input = d.children[i]) {// If there's an input...
x[i]=input.value; // ...get the value
}
//d.children[i].value = value;
i++;
}
d.innerHTML += "<input class='form-control' type='text' required autofocus name='year'/> ";
// m.innerHTML += "<td><input type='button' required autofocus name='year' value='Remove'/> </td>";
while(j!=i)
{
d.children[j].value = x[j];
j++;
}
}
答案 3 :(得分:1)
使用纯javascript试试这个
function generateRow() {
var d=document.getElementById("div");
var f = document.createElement("input");
f.name="year";
d.appendChild(f);
}
答案 4 :(得分:0)
使用jQuery略有不同的答案。可能对未来的用户有用
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script type="text/javascript">
function generateRow() {
$("#div").append("<input type='text' name='year'/><br/>");
}
</script>
</head>
<body>
<table>
<div id="div">
<!-- Buttons Go Here -->
</div>
<button type="button" onclick="generateRow();">Add</button>
</table>
</body>
</html>