Javascript 使用ajax在后台删除mysql数据库项

我有一个生成记录列表的查询：

<table class="simplet" width="640" border="0" cellspacing="0" cellpadding="0">
<thead>
<tr>
<th width="300" colspan="2">Product Name</th>
<th width="150">Brand</th>
<th width="100">Quantity</th>
<th width="60">Price</th>
<th width="30">Delete</th>
</tr>
</thead>
<tbody>
<tr><td colspan="6"><div id="status_text_list" /></td></tr>

[insert_php]

$current_user= wp_get_current_user();
$username= $current_user->user_login;

mysql_connect("localhost","xxxx","xxxx");//database connection
mysql_select_db(xxx");

$query= "SELECT * FROM wp_userdata WHERE username='$username'";
$result= mysql_query($query);
if (!$result) { die("Error db request: <br />". mysql_error()); }

while ($result_row = mysql_fetch_array($result, MYSQL_ASSOC)){ echo '<tr class="odd-row"><td width="30"></td><td>'.$result_row['product_name'].'</td><td>'.$result_row['product_brand'].'</td><td>'.$result_row['product_quantity'].'</td><td>'.$result_row['product_link'].'</td><td><a class="link-delete" href="delete.php?id='.$result_row['id'].'">X</a></td></tr>';
}


[/insert_php]

</tbody></table>

下面是我的delete.php：

mysql_connect("localhost","xxxx","xxxx");//database connection
mysql_select_db("xxxx");


if(isset($_REQUEST['id']) && is_numeric($_REQUEST['id']))
{
mysql_query("DELETE FROM wp_userdata WHERE id='".$_REQUEST['id']."'");
}

echo ("DATA DELETED SUCCESSFULLY");

此记录列表在每个表行的末尾都有一个删除“X”链接。当我点击删除链接时，我需要在后台完成删除过程而不离开页面

现在，当我单击delete时，它会将我带到delete.php页面。但这些记录会被删除

那么，如何让Ajax部分正常工作呢

也可以在不离开/刷新页面的情况下将已删除的行从屏幕上消失吗？

使用

e.preventDefault（）。像这样编辑代码

$(".link-delete").click(function(e){   // Note the e parameter
    e.preventDefault();                // NOTE THIS
    // get the form values
    // and so on and so forth

编辑

我不知道，但我只是看到了代码的这一部分：

$(".link-delete").click(function(){
    var deleteid = $(this).data("delete-id");
    //big snip
    $.ajax({
        url : "delete.php?id="+deleteid,
    //big snip
    });
});

现在可以使用我的旧代码（至少在我的浏览器中）：

希望它也能对您起作用。
此代码存在多个问题。
您正在混合Javascript和PHP

var current_user= wp_get_current_user();
var username= $current_user->user_login;

您正在尝试从PHP调用创建Javascript变量。这个不起作用。您可能正在寻找类似于：

<?php
$current_user = wp_get_current_user();
echo "var username = '" . $current_user->user_login . "'";
?>

您可以通过修改
$来访问此
数据-*
变量。单击（）
函数，如下所示：

$(".link-delete").click(function(){
 var deleteid = $(this).data("delete-id");
 //big snip
 $.ajax({
    url : "delete.php?id="+deleteid,
    //big snip
  });
});


虽然超出了问题的范围，但这段代码使用了不推荐使用的PHP
mysql.*
扩展。请考虑将MySqLi或PDO转换为数据库代码。

虽然也超出了问题的范围，但您似乎容易受到SQL注入的攻击。这是一个主要的安全风险，可以通过利用预先准备好的查询来轻松缓解，这两种扩展都可以作为
mysql.*
扩展的替代方案提供


更新：此时，您需要从视图中删除该行。您可以通过使用jQuery方便的
$.closest（）
指令来实现这一点。
$（“.link delete”）。单击（函数（）{
//大剪子
$.ajax({
//剪断
成功：功能（数据、状态、xhr）
{
//如果成功，则只需将文本输出到status div，然后清除表单输入以准备新数据
$（“#状态#文本#列表”）.html（数据）；
$（this）.closest（“tr”）.remove（）；//成功删除后删除父项
},
//再剪断
});
});
 。它们不再得到维护。看到了吗？相反，学习，并使用or-将帮助您决定哪一个。如果您选择PDO，。感谢Mysqli教程！现在，Ajax Jquery删除教程怎么样？也许这样我们就可以继续讨论这个话题了？@esqew似乎在使用
mysql\uqew.*
的每个问题中都复制并粘贴了这个评论。不过，你是对的。OP应该注意它。@afaolek我在PHP标签中的很多评论都包含了这个警告，但是OP以及这个问题的未来访问者知道这个扩展不应该再被使用是非常重要的。我更关心的是ajax功能，当我让这个部分工作时，我将重点关注mysql的现代化。这不是这篇文章的主题，你不能期望每个人都能为每个问题提供经过完美验证和优化的代码？我更改了，但仍然被重定向，这是我尝试更改的页面，但它没有删除任何内容，什么都没有happens@Acidon对不起，我似乎忘记了连字符的变量在Javascript中是不被接受的（它们被解释为减法）。我已经更新了我的答案。好的，我已经应用了更新的版本，但仍然没有成功-，看起来删除链接在浏览器中看起来很奇怪。我还更改了
echo“var username=\”.$current\u user->user\u login.\“；”要生产的零件
var username=“admin”字符串查看Javascript控制台
SyntaxError:missing}在属性列表suppliesprices.com:69之后。您通过两次声明
url:
来输入错误。（我使用Firefox31时，删除链接看起来没有什么不同，这是一个CSS问题，用于不同的问题）。Awwww，它工作了！！！！是否有方法在不刷新的情况下实时从屏幕上删除相应的显示行？是。我会把它添加到我的答案中。
<?php
$current_user = wp_get_current_user();
echo "var username = '" . $current_user->user_login . "'";
?>

<a class="link-delete" href="#" data-delete-id="' . $result_row['id'] . '">X</a>

$(".link-delete").click(function(){
 var deleteid = $(this).data("delete-id");
 //big snip
 $.ajax({
    url : "delete.php?id="+deleteid,
    //big snip
  });
});