如何调试jquery AJAX调用？

Question

我一直在努力让AJAX与Jquery一起工作.到目前为止我的大问题是我真的不知道如何弄清楚我犯了什么错误.我没有一个很好的方法来调试AJAX调用.

我正在尝试设置一个管理页面,其中我想要做的一个功能是更改我的SQL数据库中的权限集.我知道.click函数正在被触发,所以我把它缩小了,但是我不确定从AJAX调用SQL查询到哪里出错了.

我的.js代码:

$('#ChangePermission').click(function(){
    $.ajax({
        url: 'change_permission.php',
        type: 'POST',
        data: {
        'user': document.GetElementById("user").value,
        'perm': document.GetElementById("perm").value
        }
    })
})

我的.php处理程序:

<?php  
require_once(functions.php);

echo $_POST["user"];

try{
    $DBH = mysql_start();

    $STH = $DBH->prepare("INSERT INTO people ( username, permissions ) values (?, ?)");

    $STH->bindParam(1, $_POST["user"]);
    $STH->bindParam(2, $_POST["perm"]);

    $STH->execute();
}
catch(PDOException $e){
    echo $e->getMessage;
}?>

mysql_start是为我在其他SQL调用中成功使用的PDO函数设置的.

我已经研究和查找教程几天了,我不能为我的生活弄清楚出了什么问题.我可以使用工具找出错误发生的位置吗？我显然对这个特定问题的答案很感兴趣,但我认为我的更大问题是我不知道从哪里开始调试.谢谢你的帮助!

Answer 1

通过添加如下成功和错误回调,使您的JQuery调用更加健壮:

 $('#ChangePermission').click(function() {
     $.ajax({
         url: 'change_permission.php',
         type: 'POST',
         data: {
             'user': document.GetElementById("user").value,
             'perm': document.GetElementById("perm").value
         },
         success: function(result) { //we got the response
             alert('Successfully called');
         },
         error: function(jqxhr, status, exception) {
             alert('Exception:', exception);
         }
     })
 })

Answer 2

使用几乎任何现代浏览器,您需要学习网络选项卡.请参阅这篇关于如何调试AJAX调用的帖子.

Answer 3

您可以使用浏览器中的"网络"选项卡(shift + ctrl + i)或Firebug.
但是在我看来,更好的解决方案是使用外部程序(如Fiddler)来监控/捕获浏览器和服务器之间的流量.