标签:技巧总结 nta com ble 删除 for submit jquery扩展 add
<!DOCTYPE html> <html lang= "en" > <head> <meta charset= "UTF-8" > <title>用户名注册</title> <script> $(document).ready( function () { $( "#button" ).click( function () { var name = $( "#yonghu" ).val(); var mima = $( "#mima" ).val(); var youxiang = $( "#youxiang" ).val(); var tr = "<tr><td>" + ‘<input type="checkbox">‘ + "</td><td>" + name + "</td><td>" + mima + "</td><td>" + youxiang + "</td><td>" + ‘<input type="button" value="删除">‘ + "</td></tr>" ; $( "#table" ).append(tr); $( ":button" ).click( function () { $( this ).parent().parent().remove(); }); }); }); </script> </head> <body> 用户:<input id= "yonghu" type= "text" > 密码:<input id= "mima" type= "password" > 邮箱:<input id= "youxiang" type= "text" > <input type= "submit" id= "button" value= "添加" > <table id= "table" border= "1ps" > <tr> <td><input type= "checkbox" ></td> <td>用户名</td> <td>密码</td> <td>邮箱</td> <td>操作</td> </tr> </table> </body> </html> |
运行结果:
更多关于jQuery相关内容感兴趣的读者可查看本站专题:《jQuery form操作技巧汇总》、《jQuery操作json数据技巧汇总》、《jQuery常用插件及用法总结》、《jQuery扩展技巧总结》、《jQuery表格(table)操作技巧汇总》及《jquery选择器用法总结》
希望本文所述对大家jQuery程序设计有所帮助。
标签:技巧总结 nta com ble 删除 for submit jquery扩展 add
原文地址:https://www.cnblogs.com/zhuyeshen/p/11433773.html