您好,欢迎访问一九零五行业门户网

关于jQuery实现表单动态添加与删除数据的操作

这篇文章主要介绍了jquery实现表单动态添加与删除数据操作,涉及jquery事件响应及页面元素动态操作相关实现技巧,需要的朋友可以参考下
本文实例讲述了jquery实现表单动态添加与删除数据操作。分享给大家供大家参考,具体如下:
<!doctype html><html lang="en"><head> <meta charset="utf-8"> <title>用户名注册</title> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> <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实现的ajax简单弹出层效果
以上就是关于jquery实现表单动态添加与删除数据的操作的详细内容。
其它类似信息

推荐信息