【问题标题】:How to check if an event was fired or not?如何检查事件是否被触发?
【发布时间】:2014-04-01 04:28:08
【问题描述】:

我正在使用 Chrome DevTools 来调试 JavaScript。在我的脚本中,我使用 jQuery bind() 方法将点击事件绑定到一个元素。 如何检查该事件是否被触发?

编辑
抱歉,因为我没有那么具体,我知道我可以使用console.log() 或在事件侦听器主体内设置断点。我在这里谈论的是 Chrome DevTools 的一个开箱即用的功能,它允许您在不使用控制台的情况下检查它,例如一个包含所有触发相关信息的事件的选项卡。

【问题讨论】:

  • 通过 alert() 你可以检查事件是否触发
  • 在你的处理程序中使用console.log('fired')
  • 可以使用布尔型全局变量,声明时设为false,handler中设为true
  • 在您绑定的函数内的一行中设置断点并检查流是否在该行停止
  • 在绑定函数中执行一些操作 ex:alert('bind working');

标签: javascript jquery google-chrome-devtools


【解决方案1】:

关于 Chrome,通过命令行 API 检出 monitorEvents()。

  • 通过菜单 > 工具 > JavaScript 控制台打开控制台。
  • 输入monitorEvents(window);
  • 查看充斥着事件的控制台

    ...
    mousemove MouseEvent {dataTransfer: ...}
    mouseout MouseEvent {dataTransfer: ...}
    mouseover MouseEvent {dataTransfer: ...}
    change Event {clipboardData: ...}
    ...
    

documentation 中还有其他示例。我猜这个功能是在上一个答案之后添加的。

【讨论】:

    【解决方案2】:

    使用console.log()进行更友好的检查(当然必须打开控制台才能看到结果):

    $("#myElement").bind("click", function() {
       console.log("Fired!");
    });
    

    或者你可以提醒它,这更烦人:

    $("#myElement").bind("click", function() {
       alert("Fired!");
    });
    

    【讨论】:

    • 警报真的很烦人。
    【解决方案3】:

    您可以尝试下面的代码来检查事件是否触发。

    var eventFire = false;
    
    $("button").on("click", function() {
       eventFire = true;
    if(eventFire){
        alert('Event Fired')
    }   
    });   
    

    【讨论】:

      【解决方案4】:

      我通常使用警报(因为我们在 Rails 上开发——控制台不可靠):

      $(document).on("event", "#element", function() { 
          alert("event");
      });
      

      底线是你将不得不触发一些“可见”的东西来查看事件是否被触发。如果没有,你要么没有绑定到正确的元素,要么你的事件不会被触发

      希望这会有所帮助!

      【讨论】:

        【解决方案5】:

        使用 jQuery 尝试以下操作:

        $("#el").on("click", function() {
            console.log("Fired!");
        });
        

        然后您可以查看事件是否被触发。所以基本上只要在你的函数中添加一个事件触发的日志就可以了。

        【讨论】:

          【解决方案6】:

          你可以放一个“alert('message');”在您的事件处理程序中,每次处理程序触发时都会看到一个弹出窗口。 或者你可以放一个“console.log('message');”在您的事件处理程序中并查看日志以查看事件触发的所有时间。 或者,您可以将“调试器”放入事件处理程序中,并在代码在 chrome 调试器中执行时单步执行。 还有一种方法可以使用 chrome 开发工具元素面板动态查找事件处理程序并在代码中插入调试器断点。

          【讨论】:

            猜你喜欢
            • 2013-07-31
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 2018-09-23
            • 1970-01-01
            • 1970-01-01
            相关资源
            最近更新 更多