如何在Chrome开发工具中调试Common.js?

时间:2018-06-15 15:22:41

标签: javascript jquery google-chrome-devtools mediawiki

我的MediaWiki:Common.js绘制并将事件附加到按钮上。

$('#btnSave').html('<button>Send HTTP Post</button>');

如果不首先执行MW核心代码和jquery代码,我如何调试Common.js?

我尝试在Common.js中放置debugger;标志,但Chrome似乎没有注意到它。

$(document).on('click', '#btnSave', function() { 
  debugger;
  $.ajax({
    url:"../api.php?action=edit&title=Portal:TagDescriptions&section=2&summary=Hello%20World",
    type:"POST",
    data:{ Text: "Hello, world.",
          token:"c30460d9159a5e2eccca60944ef286405b2393d1%2B%5C" },
    contentType:"application/x-www-form-urlencoded",
    dataType:"json",
    success: function(data) {
        $('#lblDescription').html(data);
    }
  })
}); 

1 个答案:

答案 0 :(得分:1)

您可能需要启用Resource Loader的“调试模式”。这将禁用自动脚本缩小。通过向URL添加debug=true参数可以轻松实现这一点。 See explanation。不过,这不应该是必需的。

这通常也会强制浏览器获取最新的修改,否则可能会被缓存,并且可能会阻止您在几分钟内以非调试模式查看它们。

缓存可能是debugger语句不起作用的原因。添加debug=true可以防止缓存问题。

另一个问题可能是文件上的语法错误导致代码无法执行,或者导致事件未触发的逻辑错误,可能是因为您正在附加事件的HTML元素当时不在页面上脚本被执行。您应该将整个代码包装在“document.ready”事件中。见how to execute code on document.ready event with jQuery。例如:

$(function() {
    // Your code here
});