jQuery之表格添加删除数据
来源：互联网 发布：java游戏开发引擎 编辑：程序博客网 时间：2024/05/01 16:09
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script language="javascript" src="jquery/jquery-1.3.2.js"></script></head><body><center>姓名：<input type="text" name="name" id="name" width="100"/> 邮箱：<input type="text" name="email" id="email" width="100"/> 电话：<input type="text" name="tel" id="tel" width="100"/> <input type="button" name="adduser" id="adduser" value="添加"/><br/><br/><hr /><br/><br/><table width="300" border="1" id="usertable"><tbody> <tr> <th>姓名</th> <th>邮箱</th> <th>电话</th> <th> </th> </tr> <tr> <td>kute</td> <td>1395730364@qq.com</td> <td>5000000</td> <td><a href="deleteEmp?id=kute">Delete</a></td> </tr> <tr> <td>Tom</td> <td>tom@tom.com</td> <td>400000</td> <td><a href="deleteEmp?id=kute">Delete</a></td> </tr></tbody></table></center></body></html><script language="javascript">$("#adduser").click(function(){//添加操作 var name=$("#name").val(); var email=$("#email").val(); var tel=$("#tel").val(); var $nametd=$("<td/>"); $nametd.text(name); var $emailtd=$("<td/>"); $emailtd.text(email); var $teltd=$("<td/>"); $teltd.text(tel); var $a=$("<a></a>"); $a.attr("href","deleteEmp?id="+name); $a.text("Delete"); var $atd=$("<td/>"); $atd.append($a); var $tr=$("<tr></tr>"); $tr.append($nametd); $tr.append($emailtd); $tr.append($teltd); $tr.append($atd); $("#usertable").children().eq(0).append($tr);alert("eeee"); //删除操作 $a.click(function(){ return delTr($a); });});function delTr($a){var name=$a.parent().parent().children().eq(0).text();alert(name);var flag=window.confirm("是否要删除 ["+name+"] 用户");if(!flag){return false;}$a.parent().parent().remove();return false; }</script>
