用Firebug调试Ajax代码

前端之家收集整理的这篇文章主要介绍了用Firebug调试Ajax代码前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
调试代码返回Ajax调用中有几个问题 – 具体来说,json中返回的一个函数(错误不会被困在Firefox中) – 直到我在Internet Explorer中调试这些问题(我认为它是一个firefox相关的问题,因为Venkman也没有检测到这些错误)你知道任何方式调试json从Ajax调用返回代码

EDITED 03/04/2009 15:05

感谢所有的回应,但我觉得我没有足够的解释自己。我知道足够的Firebug进行基本的调试,但是当我在Ajax调用提取一些有问题的代码时,我的问题就会发生。假设我们有以下HTML文件(您需要在同一文件夹中使用原型使其正常工作):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script type="text/javascript" src="prototype.js"></script>
</head>
<body>
<script>
function ajaxErrorTest()
{
    new Ajax.Request('data.json',{
           'method': 'get','onSuccess': function(data){
           if(data.responseJSON.func)
           data.responseJSON.func();}});
}
</script>
<input type="button" value="test" onclick="ajaxErrorTest();" />
</body>
</html>

然后,data.json文件内容是这样的:

{'func':function(){console.log('loaded...');alert('hey');}}

如果您在浏览器中加载页面,然后单击“测试”按钮(一切顺利),您将在控制台中获得一些内容,并显示一个“嘿”的提示框。现在将data.json文件更改为:

{'func':function(){console.log('loaded...');alerts('hey');}}

…并再次点击“测试”按钮(无需重新加载页面;-)
你得到控制台行,但没有警报框…没有错误!这是我试图调试的那种错误

尝试点击“控制台”面板(它是一个选项卡)并启用它。您会发现任何HTTP请求都将被捕获,并包含它们包含的任何信息。我使用它来查看请求中存储的任何JSON以及任何错误(500/404 / etc)。

还要注意,您必须在每个域的基础上启用控制台面板。通常有三个子标题标题文章和响应。当我调试我的AJAX时,我通常会使用post / response选项卡。

猜你在找的Ajax相关文章