Jquery学习笔记(11)--jquery的ajax删除用户,非常简单!

时间:2023-03-09 18:44:26
Jquery学习笔记(11)--jquery的ajax删除用户,非常简单!

jquery的ajax,简直简单!!只要一个$.get(url,map,function)就搞定了!

index.php:

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="jquery.js"></script>
</head>
<body>
<table border="1px" cellspacing="0">
<tr>
<td>id</td>
<td>用户名</td>
<td>密码</td>
</tr>
<?php
$pdo = new PDO("mysql:host=localhost;dbname=userlist","root","jia6181813");
$sql = "SELECT * FROM users";
$obj = $pdo->query($sql);
while($row=$obj->fetch()){
echo "<tr>";
echo "<td>$row[id]</td>";
echo "<td>$row[name]</td>";
echo "<td>$row[password]</td>";
echo "<td><a href='javascript:' name='$row[id]'>删除</a></td>";
echo "</tr>";
} ?>
</table>
</body>
<script>
$('a').click(function(){
//这个地方点击删除的a链接,取得里面name属性的id值,用来xhr.open里面的url。如果不这么做,就得循环遍历所有a链接,还要添加一个存放id的类,具体参考php里的ajax操作。
//这地方可以直接用this.name,this指代这个a标签,可以点出它的所有属性。
var id = $(this).attr('name'); //that的运用,因为在下面的函数里面$(this)已经变了
var that = $(this);
//jquery的ajax,$.get和$.post,参数有三个:url,url传值参数,接收返回值r的回调函数。
$.get("delete.php",{id:id},function(r){
if (r==1) {
//hide可以加个时间
// that.parent().parent().hide(1000);
//fadeOut也可以
that.parent().parent().fadeOut(1000); }else{
alert(123);
}
});
});
</script>
</html>

delete.php:这个不用改

<?php
$id = $_GET[id];
$pdo = new PDO("mysql:host=localhost;dbname=userlist","root","123");
$sql = "DELETE FROM users WHERE id = $id";
// $pdo->query($sql);
if ($pdo->query($sql)) {
//这里是echo,不是return!!
echo 1;
}else{
echo 0;
}
//后面这句不能要啦!不然输出就不是1了,后面跟了一串。。。
// echo "<script>location='index.php'</script>";
?>