Question

这是我遇到的问题的MCVE。假设我有一个非常简单的测试页面：

<html>
<header>
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
    <script>
        function testMethod(e){
            alert(e.target.id);
        }
        $(document).ready(function(){
            $("#btn_test").on("click", testMethod, event);           
        });
    </script>
</header>
<body>
    <input type="button" id="btn_test" value="OK" />
</body>
</html>

你可以找到jsfiddle here。

在Chrome或IE中，当我按下按钮时，ID将显示在消息框中。但是在Firefox中没有定义window.event，我无法将testMethod绑定到按钮的onclick事件。

我知道如果我将其内联写入，我可以通过这样的事件：

onclick="testMethod(event)"

但是如何在没有内联编写的情况下将事件传递给我的函数？

Answer 1

通常，当您使用on或addEventListener订阅事件时，事件对象将作为参数传递给回调。注册回调时，您永远不必明确传递它。所以这样做：

$("#btn_test").on("click", testMethod);

Firefox上的代码问题是没有全局event属性，并且出现错误：

ReferenceError: event is not defined

您的活动订阅永远不会注册。

Answer 2

删除它在firefox上运行的第3个参数。

$("#btn_test").on("click", testMethod);

Answer 3

如果您参考jQuery参考here，您会注意到第三个参数必须是处理程序。因此，只需删除第三个参数并传递处理程序即可实现此目的。

查看演示小提琴here。

<body>
    <input type="button" id="btn_test" value="OK" />
</body>
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
    <script>
        function testMethod(e){
            alert(e.target.id);
        }
        $(document).ready(function(){
            $("#btn_test").on("click", testMethod);           
        });
    </script>

传递事件对象以在firefox中触发函数

3 个答案: