<head>
<title> </title>
<style type="text/css">
td,th{border:1px solid gray}
td,input{font:35px 宋体}
input{width:80px}
</style>
<script type="text/javascript">
function addRow(){
var obj = document.getElementById("table")
var index = obj.rows.length-1
var row = obj.insertRow(index)
//给行对象添加一个ID
row.id="row"+index
//行对象插入一个单元格，并返回单元格对象
var td0 = row.insertCell(0)
// td0.cellIndex row.rowIndex
td0.innerHTML=row.rowIndex+" "+td0.cellIndex
var td1 = row.insertCell(1)
td1.innerHTML=index+" "+td1.cellIndex
var td2 = row.insertCell(2)
td2.innerHTML=index+" "+td2.cellIndex
var td3 = row.insertCell(3)
// td3.innerHTML=index+" "+td3.cellIndex
// alert(row.cells.length)
td3.innerHTML='<input type="button" value="删除" onclick="delRow(\''+row.id+'\')" />'
}
function delRow(id){
var obj = document.getElementById("table")
//得到要删除的行
var row = document.getElementById(id)
alert(row.rowIndex)
//根据行索引删除行
obj.deleteRow(row.rowIndex)
}
//删除一个单元格
function f()
{
var obj = document.getElementById("table")
var rows = obj.rows
rows[0].deleteCell(0)
}
</script>
</head>
<body>
<table border="0" width="80%" id="table" cellspacing="0" cellpadding="0" height="50%" style="font-size:50px">
<tr class="tr1">
<th width="30%">商品名称</th>
<th width="20%">数量</th>
<th width="20%">价格</th>
<th width="30%"> *** 作</th>
</tr>
<tr id="row1">
<td>仿真休闲皮鞋</td>
<td >12</td>
<td>￥168.0</td>
<td>
<input type="button" value="删除" onclick="delRow('row1')" />
</td>
</tr>
<tr id="row2">
<td>白金项链</td>
<td>2</td>
<td>￥156.0</td>
<td>
<input type="button" value="删除" onclick="delRow('row2')"/>
</td>
</tr>
<tr>
<td colspan="4" align="center">
<input type="button" value="增加" onclick="addRow()"/>
</td>
</tr>
</table>
<input type="button" value="click" onclick="f()">
</body>
</html>
<html><head>
<title>js动态的在页面上增加或删除一个文本框</title>
<script type="text/javascript">
<!--
var textNumber = 1
function addTextBox(form, afterElement) {
// Increment the textbox number
textNumber++
// Create the label
var p = document.createElement("p")
p.id="txt"+textNumber
var label = document.createElement("label")
// Create the textbox
var textField = document.createElement("input")
textField.setAttribute("type","text")
textField.setAttribute("name","biaozhundaan"+textNumber)
textField.setAttribute("id","biaozhundaan"+textNumber)
// Add the label's text
label.appendChild(document.createTextNode("第"+textNumber+"空: "))
// Put the textbox inside(里面)的//把文本框放进去
label.appendChild(textField)
// Add it all to the form fengshu
p.appendChild(label)
var label = document.createElement("label")
// Create the textbox
var textField = document.createElement("input")
textField.setAttribute("type","text")
textField.setAttribute("name","pingfengA"+textNumber)
textField.setAttribute("id","pingfengA"+textNumber)
// Add the label's text
label.appendChild(document.createTextNode("评分词"+textNumber+": "))
// Put the textbox inside(里面)的//把文本框放进去
label.appendChild(textField)
// Add it all to the form
p.appendChild(label)
var label = document.createElement("label")
// Create the textbox
var textField = document.createElement("input")
textField.setAttribute("type","text")
textField.setAttribute("name","fengshu"+textNumber)
textField.setAttribute("id","fengshu"+textNumber)
// Add the label's text
label.appendChild(document.createTextNode("分数"+textNumber+": "))
// Put the textbox inside(里面)的//把文本框放进去
label.appendChild(textField)
// Add it all to the form
//
p.appendChild(label)
form.insertBefore(p,afterElement)
return false
}
function removeTextBox(form) {
if (textNumber > 1) { // If there's more than one text box
// Remove the last one added
form.removeChild(document.getElementById("txt"+textNumber))
textNumber--
}
}
//-->
</script>
</head>
<body>
<form id="myForm" method="get" action="./" />
<label>Text Box #1a: <input type="text" name="txt1" id="txt1" /></label>
<p>
<input type="button" value="Add Textbox" onClick="addTextBox(this.form,this.parentNode) " />
<input type="button" value="Remove Textbox" onClick="removeTextBox(this.form)" />
</p>
<p><input type="Submit" value="Submit" /></p>
</form>
</body>
</html>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）