有关Html的问题
在一页面上有一个表格，该表格只有有一表头，下面是已输入框和一按钮。我想在点击按钮时表头下面会自动加一行表格，并把输入框的内容显示在那里。该怎么做啊，求高手指点。最好有相应代码！
[解决办法]
<html>
<body>
<table border="1" id="tbId">
<tr>
<td>表头</td>
<tr>
</table>
<input type="text" name="info" id="info" /> <input type="button" value="添加" onclick="addText()" />
<script>
<!--
function addText(){
var tbid=document.getElementById("tbId");
var info=document.getElementById("info");
var infoText=info.value;
var tr=document.createElement("tr");
var td=document.createElement("td");
td.innerHTML=infoText;
tr.appendChild(td);
tbid.appendChild(tr);
info.value="";
}
-->
</script>
</body>
</html>
[解决办法]
使用js实现。
<table id="selfAddTable" >
<th>编号</th><th>姓名</th><th>按钮</th>
<tr><td><input /></td><td><input /></td><td><button onclick="selfAdd();"/></td></tr>
</table>
<script language="java/text">
function selfAdd(){
var table = document.findElementById("selfAddTable");
var content = "<tr><td><input /></td><td><input /></td><td><input type='button' onclick='selfAdd();' /></td>";
table.append(content);
}
</script>
你试试~
[解决办法]
- HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title></title><style> a{color:blue;}</style><script> function addRow(obj1,obj2){ var title = document.getElementById(obj1); var content = document.getElementById(obj2); var myTable=document.getElementById('myTable').insertRow(0) var x=myTable.insertCell(0); var y=myTable.insertCell(1) var z=myTable.insertCell(2) x.innerHTML=title.value; y.innerHTML=content.value; z.innerHTML="<a href=\"#\" onclick=\"deleteRow(this)\">删除</a>"; } function deleteRow(obj){ var i = obj.parentNode.parentNode.rowIndex; document.getElementById('myTable').deleteRow(i); }</script></head><body><table id="myTable" style="border:1px solid blue;" cellspacing="3" cellpadding="3"><tr><td><input type="text" id="title" /></td><td><input type="text" id="content"/></td><td><input type="button" value="保存" onclick="addRow('title','content')" /></td></tr></table></body></html>