jQuery实现html表格动态添加新行的方法

这篇文章主要介绍了jQuery实现html表格动态添加新行的方法,涉及jQuery鼠标事件及页面元素的操作技巧,需要的朋友可以参考下

本文实例讲述了jQuery实现html表格动态添加新行的方法。分享给大家供大家参考。具体实现方法如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Add Row example</title> <script src="https://www.jb51.net/jquery-1.6.2.min.js"></script> <script type="text/javascript"> <!-- jQuery Code will go underneath this --> $(document).ready(function () { // Code between here will only run when the document is ready $("a[name=addRow]").click(function() { // Code between here will only run //when the a link is clicked and has a name of addRow $("table#myTable tr:last").after('<tr><td>Row 4</td></tr>'); return false; }); }); </script> </head> <body> <table> <tr><td>Row 1</td></tr> <tr><td>Row 2</td></tr> <tr><td>Row 3</td></tr> </table> <a href="#">Add Row</a> </body> </html>

希望本文所述对大家的jQuery程序设计有所帮助。

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wgjygs.html