Chrome JavaScript调试器断点不做任何事情？
我似乎无法弄清楚Chrome调试工具。
我采取的步骤：
- 我按下了ctrl-shift-i来调出控制台。
- 点击Sources然后选择我想调试的相关javascript文件。
- 我通过在左边的行旁边的排水沟上放置一个蓝色标记来设置要停止代码的断点。
- 我点击了我的网页上的按钮（这是一个PHP呈现的页面），它启动了javascript代码。
- 代码成功运行而不停止。
我也注意到Watch表达式也不起作用。它一直告诉我，我想观看的变量是未定义的。
进一步的测试发现它是我的代码导致断点失败。它看起来在$（“＃frmVerification”）。submit（function（）{“）行上失败了，它并没有进入该函数内部的断点（）。
以下是：
//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;
});
});
回答 2
Stack Overflow用户
发布于 2018-03-20 16:19:22
我不确定为什么你的断点没有打到，但是一步一步进入你的代码的方法就是输入
debugger;
您希望代码暂停的位置，然后在chrome开发人员工具窗口打开的情况下再次运行。
只需要注意一件小事，确保在完成后清理并移除调试器线。如果您曾经通过YUI压缩器运行JavaScript文件，则debugger;线路的存在会导致错误。
Stack Overflow用户
发布于 2018-03-20 17:07:39
这是一个迟到的答案，但我有同样的问题，但答案不同。
就我而言，我的代码中有一个sourceURL引用：
//@ sourceURL=/Scripts/test.js
当此JavaScript文件被缩小并由浏览器加载时，它通常会告知Chrome开发人员工具的未修剪版本。
但是，如果您正在调试unminified版本并且存在此行，则Chrome开发工具将映射到该sourceURL路径而不是“正常”路径。
例如，如果您在Web服务器上本地工作，则在Chrome开发工具的Sources选项卡中，给定JS文件的路径将为 http://localhost/scripts/test.js
如果test.js在底部有这个
//@ sourceURL=/Scripts/test.js
那么断点将只在文件路径是/Scripts/test.js，而不是完全限定的URL 时才起作用http://localhost/scripts/test.js
在Chrome 38中，使用上面的示例，如果您查看Sources选项卡，则每个文件都会运行http://localhost/，因此当您单击test.js时，Chrome会加载http://localhost/scripts/test.js
您可以在此文件中放入所有需要的断点，而Chrome从不会碰到任何断点。如果您在调用test.js中的任何函数之前在JS中放置断点，然后进入该函数，您将看到Chrome会打开一个新路径的选项卡/Scripts/test.js。在这个文件中放置断点将停止程序流程。
当我@ sourceURL从JS文件中删除该行时，所有事情都会正常工作（即您期望的方式）。
https://stackoverflow.com/questions/-100004280
复制相似问题