js按钮增加一行表格

JavaScript032

js按钮增加一行表格,第1张

首先定义一个闭包，如下：

var appendText = function(){

//变量作用域为函数内部，外部无法访问

var html = ""

return {

getHtml : function(tmpNum){

html += "<input type='text' name='txt"+tmpNum+"'>"

return html

}

}

}()

然后修改你的代码

oTD.innerHTML = appendText.getHtml(tmpNum)

或者有兴趣的话可以学习一下Jquery，里面有相应方法很轻松地实现你的需求。

<html>

<head>

<title>test</title>

<meta http-equiv="content-Type" content="text/htmlcharset=utf-8">

<script src="jquery-1.7.2.min.js"></script>

<script type="text/javascript">

$(function(){

$('#addBtn').click(function(){

$('#tab').after($('#tab').clone(true))

})

$('#delBtn').click(function(){

if($('.tab_css').length >1)//保留第一个

$('.tab_css:last').remove()

})

})

</script>

<body>

<button id="addBtn">addTable</button>

<button id="delBtn">removeTable</button>

<table id="tab" width="98%" border="0" cellpadding="0" cellspacing="1" class="tab_css">

<tr>

<td width="135" height="27">日期：</td>

<td width="254" height="27"><input name="Update" type="text"></td>

<td width="67" height="27">贷方：</td>

<td width="271" height="27"><input name="huofang" type="text"></td>

<td width="99" height="27">付款方式：</td>

<td width="379" height="27">

<select size="1" name="Payment">

<option value="">请选择</option>

<option value="未付">未付</option>

<option value="电汇">电汇</option>

<option value="支票">支票</option>

</select></td>

</tr>

<tr>

<td>发票编号：</td>

<td><input name="fapiao" type="text"/> </td>

<td>借方：</td>

<td width="767" colspan="3"><input name="jiefang" type="text" /> </td>

</tr>

<tr>

<td height="41"></td>

<td colspan="5" align="left"height="41" width="1097">

<input name="submit" type="submit" value=" 确认提交 "> <input name="reset" type="reset" value=" 重新填写 ">

　</td>

</tr>

</table>

</body>

</html>