jquery的简单使用

最新推荐文章于 2023-08-12 10:47:33 发布

猿猴

最新推荐文章于 2023-08-12 10:47:33 发布

阅读量400

点赞数 1

分类专栏： jquery

本文链接：https://blog.csdn.net/u013045706/article/details/17126133

版权

1 篇文章 0 订阅

订阅专栏

	<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
	<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<script language="JavaScript" src="../js/jquery-1.10.2.js"></script>
	<title>添加用户</title>
	</head>
	<body>
	<center>
	<br><br>
	添加用户:<br><br>
	姓名: <input type="text" name="name" id="name" />
	email: <input type="text" name="email" id="email" />
	电话: <input type="text" name="tel" id="tel" /><br><br>
	<button id="addUser">提交</button>
	<br><br>
	<hr>
	<br><br>
	<table id="usertable" border="1" cellpadding="5" cellspacing=0>
	<tbody>
	<tr>
	<th>姓名</th>
	<th>email</th>
	<th>电话</th>
	<th> </th>
	</tr>
	<tr>
	<td>Tom</td>
	<td>tom@tom.com</td>
	<td>5000</td>
	<td><a href="deleteEmp?id=Tom">Delete</a></td>
	</tr>
	<tr>
	<td>Jerry</td>
	<td>jerry@sohu.com</td>
	<td>8000</td>
	<td><a href="deleteEmp?id=Jerry">Delete</a></td>
	</tr>
	</tbody>
	</table>
	</center>
	</body>
	<script language="JavaScript">

	$("#addUser").click(function(){
	var $name=$("#name").val();
	var $email=$("#email").val();
	var $tel=$("#tel").val();
	var $td=$("<td></td><td></td><td></td><td></td>");

	var $tr=$("<tr></tr>");

	$td.each(function(index,obj){

	if(index==0){

	$(this).html($name);
	}
	if(index==1){

	$(this).html($email);
	}
	if(index==2){

	$(this).html($tel);
	}

	if(index==3){

	$(this).append( $("<a href='#'>Delete</a>"));
	}

	});
	$tr.append($td);
	$("#usertable").append($tr);
	$("#addUser a").each(function (){

	});

	});

	function delU(){

	}
	</script>
	</html>

关注