<td class="tableleft">标题</td>
<td>
<input name="title" type="text" id="title" style="width:150pxvertical-align:middle" maxlength="40" >
<lable>文件名</lable>
<input name="filename" type="text" id="filename" style="width:150pxvertical-align:middle" maxlength="40" >
<lable>时间</lable>
<input name="time" type="text" id="time" style="width:150pxvertical-align:middle" maxlength="40" onClick="WdatePicker()">
<lable>内容简介</lable>
<input name="content" type="text" id="content" style="width:300pxvertical-align:middle" maxlength="50" >
<input type="button" class="btn btn-success" value="增加" id="addTable" onclick="add_tr(this)"/>
<input type="button" class="btn btn-success" value="删除" id="deleteTable"/>
</td>
</tr>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script>
function add_tr(obj) {
var tr = $(obj).parent().parent()
tr.after(tr.clone())
}
</script>
<html><head>
<title>添加行</title>
<script type="text/javascript">
function addRow() {
var tb = document.getElementById("tb")
var length = tb.rows.length//该表格的总行数
var row = tb.insertRow(length)//在行末尾添加一行
row.ondblclick = function () { altRowNum1(row)} //为行添加双击事件
var c1 = row.insertCell(0)//添加单元格
c1.innerHTML = length + 1
var c2 = row.insertCell(1)
c2.innerHTML = '<input type="text" />'
var c3 = row.insertCell(2)
c3.innerHTML = '<input type="button" onclick="altRowNum2(this)" value="当前行"/>'
}
function altRowNum1(row) {
var rowIndex = row.rowIndex//行号
alert("行双击，这是第 " + (rowIndex + 1) + " 行，行下标为 " + rowIndex)
}
function altRowNum2(btn) {
var rowIndex = btn.parentNode.parentNode.rowIndex//btn的父节点为单元格，单元格的父节点当前行
alert("单元格按钮单击，这是第 " + (rowIndex + 1) + " 行，行下标为 " + rowIndex)
}
</script>
</head>
<body>
<input type="button" value="添加" onclick="addRow()"/><br/>
<table id="tb" width="200px" border="1px" >
<tr ondblclick="altRowNum1(this)"><td>1</td><td><input type="text" value="60"/></td><td><input type="button" onclick="altRowNum2(this)" value="当前行"/></td></tr>
<tr ondblclick="altRowNum1(this)"><td>2</td><td><input type="text" value="67"/></td><td><input type="button" onclick="altRowNum2(this)" value="当前行"/></td></tr>
<tr ondblclick="altRowNum1(this)"><td>3</td><td><input type="text" value="59"/></td><td><input type="button" onclick="altRowNum2(this)" value="当前行"/></td></tr>
<tr ondblclick="altRowNum1(this)"><td>4</td><td><input type="text" value="70"/></td><td><input type="button" onclick="altRowNum2(this)" value="当前行"/></td></tr>
<tr ondblclick="altRowNum1(this)"><td>5</td><td><input type="text" value="80"/></td><td><input type="button" onclick="altRowNum2(this)" value="当前行"/></td></tr>
<tr ondblclick="altRowNum1(this)"><td>6</td><td><input type="text" value="90"/></td><td><input type="button" onclick="altRowNum2(this)" value="当前行"/></td></tr>
<tr ondblclick="altRowNum1(this)"><td>7</td><td><input type="text" value="hh"/></td><td><input type="button" onclick="altRowNum2(this)" value="当前行"/></td></tr>
<tr ondblclick="altRowNum1(this)"><td>8</td><td><input type="text" value="98"/></td><td><input type="button" onclick="altRowNum2(this)" value="当前行"/></td></tr>
<tr ondblclick="altRowNum1(this)"><td>9</td><td><input type="text" value="99"/></td><td><input type="button" onclick="altRowNum2(this)" value="当前行"/></td></tr>
<tr ondblclick="altRowNum1(this)"><td>10</td><td><input type="text" value="100"/></td><td><input type="button" onclick="altRowNum2(this)" value="当前行"/></td></tr>
</table>
<div id="resultDiv">
</div>
</body>
</html>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）