Question

我在调试Chrome中的下一个代码时发现了一些奇怪的代码行为：

1. $('.btn-info').click(function(){
2.         console.log("Category ID: " + $(this).attr("category_id"));
3.         var categoryId = $(this).attr("category_id") ;
4.         console.log("CategoryID: " + categoryId);
5. });

当我在第3行放置一个断点并使用调试器运行脚本时，我按预期在控制台中打印了消息Category ID: {some value}。然而，继续踩过第3行并检查categoryId的值会将某个变量的值显示为NaN，所以在踩到第4行之后我会进入控制台{{ 1}}。

有趣的是，如果我在没有断点的情况下运行相同的脚本，我会按预期在控制台中打印两条消息Category ID:。

有人可以解释这种奇怪的行为吗？

谢谢。

Answer 1

调试时出现的问题通常发生在其他地方正在改变价值时，例如

var val=1;
$.get(..., function(){
  val=2
});
console.log(val);

如果你在console.log（）上添加断点，程序可能会有足够的时间来完成get并运行回调。但是在断点处输出通常为val = 1.

当然不是那么明显，但看看回调，你会发现问题

在chrome中逐步调试时，jQuery的attr（）失败了

1 个答案: