Jquery 操作table行增减
开门见山,我就用例子给大家解释吧?
页面中的元素:
<table cellspacing="0" id="tQuestion" border="1" rules="all" class="mainTab" style="width: 100%"> <tr> <th> 大题名称 </th> <th> 大题说明 </th> <th> 操作 </th> </tr> </table>
js操作元素:
//新增试卷_添加行 function addtr(id) { tr_id = $("#tQuestion>tbody>tr:last").attr("id"); tr_id++; $('#' + id).append(GetStr(tr_id)); } //新增试卷_删除行 function deltr(id) { tr_id = $("#tQuestion>tbody>tr:last").attr("id"); if (tr_id != 1) { $('#' + tr_id).remove(); } } //动态添加一行 function GetStr(tr_id) { var str = "<tr id='" + tr_id + "'><td><input type=\"text\" id=\"TxtTitle_" + tr_id + "\" name=" + tr_id + " value=\"\" style=\"width:90%\"/></td>"; str += "<td><textarea style=\"width:90%; border: 1px solid rgb(164, 194, 204);\" id=\"TxtPrompt_" + tr_id + "\" cols=\"20\" rows=\"2\" name=" + tr_id + "></textarea></td>"; str += "<td><input type=\"button\" class=\"normalBtn\" id=\"btnQuestionAdd\" value=\"新增\" name=\"btnQuestionAdd\" onclick=\"addtr('tQuestion')\">"; str += " <input type=\"button\" class=\"normalBtn\" id=\"btnQuestionDel\" value=\"删除\" name=\"btnQuestionDel\" onclick=\"deltr('tQuestion')\"></td>"; str += "</tr>"; return str; } $(function () { $('#tQuestion').append(GetStr(1)); })
欧了,希望对大家有所帮助,偶尔想不起来我也可以参考一下!呵呵!!!