Chrome JavaScript调试器断点不做任何事情？ [英] Chrome javascript debugger breakpoints don't do anything?

问题描述

我似乎无法弄清楚Chrome调试工具。

我有chrome版本21.0.1180.60米。

我采取的步骤：

1. 我按下ctrl-shift-i调出控制台。 $ b
2. 点击Sources，然后选择我想要调试的相关javascript文件。


3. 我在代码中设置断点，然后将蓝色标记放在下一个排水沟上到$左边的行。
   
4. 我点击了我的网页（这是一个php呈现的页面）上启动JavaScript代码的按钮。


5. 代码无需停止即可成功运行。

我也注意到Watch表达式也不起作用。它一直告诉我我想观看的变量是未定义的。

进一步的测试发现它是我的代码导致断点失败。看起来它在$（＃frmVerification）。submit（function（）{）行上失败了，它并没有进入该函数内部的断点（$）。

下面是：

  //检查名称和注释字段的函数
 var test =this是测试; 
 var test2 =这是另一个测试; 
 
函数validateLogin（）{
 //if（userEmail.attr(\"value）& & userPass.attr（value））
返回true; 
 // else 
 //返回false; 
} 
 
 // onclick 
函数ajaxRequest（）{
 
} 
 $（document）.ready（function（）{
 //表单提交时
 $（＃frmVerification）。submit（function（）{
 var username = $（＃username）; 
 var token = $（＃token）; 
 var action = $（＃action）; 
 var requestester = $（＃requester）; 
 if（validateLogin（））{
 $ .ajax（{
类型：发布，
 url：verification.php，
 data：username =+ username.html（）+& token =+ token.val（）+& action =+ action.val（） +& requester =+ requester.val（），
成功：函数（数据）{
尝试{
 var jsonObj = $ .parseJSON（data）; //将数据转换为json对象，如果数据与json不兼容则抛出异常
 if（jsonObj.length> 0）{//如果有任何错误输出所有数据
 var htmUl = $（' < UL>< / UL>'）; 
 $ .each（jsonObj，function（）{
 htmUl.append（'< li> + this +'< / li>）; 
}）; 
 $（＃errOut）。html（htmUl）; 
} else {
 alert（您的账户已经激活，谢谢。如果您已经登录，请按OK进入主页。如果没有，您必须先登录。） ; 
 window.location.replace（home.php）; 
 
 $ b catch（e）{//如果错误输出错误为errOut] 
 $（＃errOut）。html（PHP模块返回非JSON对象： < p> 中+数据+ < / p>中）; 
} 
} 
}）; 
} 
 else alert（请填写用户名和密码！）; 
返回false; 
}）; 
}）; 
  

解决方案

我不确定您的断点为什么不是打击，但一步一步进入你的代码的方式是键入

  debugger; 
  

您希望代码暂停的位置，然后在chrome开发人员工具窗口打开的情况下再次运行。

---

只需要注意一件小事，确保在完成后清理并移除调试器行。如果您曾经通过YUI压缩器运行JavaScript文件，则存在调试器; 行会导致错误。

I can't seem to figure out the Chrome debugging tool.

I have chrome version 21.0.1180.60 m.

Steps I took:

1. I pressed ctrl-shift-i to bring up the console.
2. Clicked on Sources then select the relevant javascript file that I want to debug.
3. I set breakpoints where I want the code to stop by putting a blue tag on the gutter next to the line on the left.
4. I clicked on the button on my webpage (which is a php rendered page) that initiates the javascript code.
5. The code ran successfully without stopping.

I also noticed that the Watch Expressions don't work either. It keeps telling me that the variable that I want to watch is undefined.

Further testing found that it's my code that's causing the breakpoint to fail. It seems that it fails on the "$("#frmVerification").submit(function(){" line. It doesn't step into the breakpoints inside that function().

Below is the:

//function to check name and comment field 
var test = "this is a test";
var test2 = "this is another test";

function validateLogin(){
    //if(userEmail.attr("value") && userPass.attr("value"))
        return true;
    //else
        //return false;
}

//onclick on different buttons, do different things.
function ajaxRequest(){

}
$(document).ready(function(){
  //When form submitted
    $("#frmVerification").submit(function(){
        var username = $("#username");
        var token = $("#token");
        var action = $("#action");
        var requester = $("#requester");
        if(validateLogin()){
            $.ajax({
            type: "post",
            url: "verification.php",
            data: "username="+username.html()+"&token="+token.val()+"&action="+action.val()+"&requester="+requester.val(),
            success: function(data) {
                try{
                    var jsonObj = $.parseJSON(data); //convert data into json object, throws exception if data is not json compatible
                    if(jsonObj.length > 0){//if there is any error output all data
                        var htmUl = $('<ul></ul>');
                        $.each(jsonObj, function(){
                            htmUl.append('<li>' + this + '</li>');
                        });
                        $("#errOut").html(htmUl);
                    }else{
                        alert("Your account is now activated, thank you. If you have already logged in, press OK to go to the home page. If not, you must log in first.");
                        window.location.replace("home.php");
                    }
                }
                catch(e){//if error output error to errOut]
                    $("#errOut").html("PHP module returned non JSON object: <p>"+data+"</p>");
                }
            }
        });
    }
    else alert("Please fill UserName & Password!");
        return false;
    });
});

解决方案

I'm not sure why your breakpoints aren't hitting, but one sure-fire way to step into your code is to type

debugger;

where you want the code to halt, and then run again with the chrome developer tools window open.

---

Just one small thing to be aware of, be sure to clean up after you done and remove the debugger lines. If you ever run JavaScript files through YUI compressor, the existence of a debugger; line will cause it to error out.

这篇关于Chrome JavaScript调试器断点不做任何事情？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！