這次帶給大家jQuery給html表格動態新增行方法總結,jQuery為html表格動態新增行的注意事項有哪些,下面就是實戰案例,一起來看一下。
本文實例講述了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="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 style="width: 100%" id="myTable"> <tr><td>Row 1</td></tr> <tr><td>Row 2</td></tr> <tr><td>Row 3</td></tr> </table> <a href="#" name="addRow">Add Row</a> </body> </html>
相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!
推薦閱讀:
#Jquery解析json字串json陣列步驟詳解(附程式碼)
以上是jQuery給html表格動態新增行方法總結的詳細內容。更多資訊請關注PHP中文網其他相關文章!