jquery实现将注册信息保存表格中

最新推荐文章于 2020-10-16 19:26:20 发布

哆啦梦没有A

最新推荐文章于 2020-10-16 19:26:20 发布

阅读量444

点赞数

文章标签： js html jquery

本文链接：https://blog.csdn.net/qq_43438694/article/details/107430354

版权

这篇博客介绍如何利用jQuery将用户注册信息实时保存并显示在网页表格中，同时实现了点击表格中的删除按钮删除对应行信息的功能。

摘要由CSDN通过智能技术生成

jquery实现将注册信息保存表格中

页面中输入注册的用户信息，点击注册按钮，将输入的信息保存展示到页面的表格中。点击表中的删除按钮，可以将当前一行的用户信息删除。

js代码如下：

<script type="text/javascript">
		
		/*1.绑定注册按钮事件*/	
			$("#btn").click(function(){
			//2.获取表单中输入的内容	
				var username =$("#username").val();
				var pwd = $("#pwd").val();
				var mail =$("#mail").val();
			//3.创建表格的行和列元素	
				var tr =$("<tr></tr>");//jq创建tr方法
				var tdusername = $("<td></td>");//创建username列
				var tdpwd = $("<td></td>");//创建pwd列
				var tdmail =$("<td></td>");//
			//4.将输入的内容设置到新创建的列元素显示
			 	tdusername.html(username);
			 	tdpwd.html(pwd);
			 	tdmail.html(mail);
			 //5.将列元素添加到行元素中
			 tr.append(tdusername);
			 tr.append(tdpwd);
			 tr.append(tdmail);
			//6.将行元素添加到表格元素中
			$("table").append(tr);
			//7.创建删除