jQuery实现html表格动态添加新行的方法
本文实例讲述了jQuery实现html表格动态添加新行的方法。分享给大家供大家参考。具体实现方法如下:
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml"> <head> <metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/> <title>AddRowexample</title> <scriptsrc="jquery-1.6.2.min.js"></script> <scripttype="text/javascript"> <!--jQueryCodewillgounderneaththis--> $(document).ready(function(){ //Codebetweenherewillonlyrunwhenthedocumentisready $("a[name=addRow]").click(function(){ //Codebetweenherewillonlyrun //whenthealinkisclickedandhasanameofaddRow $("table#myTabletr:last").after('<tr><td>Row4</td></tr>'); returnfalse; }); }); </script> </head> <body> <tablestyle="width:100%"id="myTable"> <tr><td>Row1</td></tr> <tr><td>Row2</td></tr> <tr><td>Row3</td></tr> </table> <ahref="#"name="addRow">AddRow</a> </body> </html>
希望本文所述对大家的jQuery程序设计有所帮助。