Question

Firefox 错误：尽管传递了“事件”作为函数参数，但“事件未定义”

2017-12-29

951

javascript jquery

假设我想要一个自定义函数来处理页面转换。页面上的链接和 div 元素上都有“点击”事件监听器。显然，对于链接，我想阻止默认链接操作，以便我的函数可以在转换效果完成后接管页面重定向。

下面的 jsfiddle 是一个简化的示例。它在 Chrome、IE、Opera 中有效，但 Firefox 会抛出 ReferenceError：事件未定义

HTML

<div id="div">Div</div>
<a id="link" href="#">Link</a>
<div id="result" style="display:none">Clicked</div>

JS

$('#div, #link').click(myfunc(event));

function myfunc(event){

    return function(){
    if(event) { event.preventDefault(); }
    $('#result').show();
  }

}

我有一些方法可以避免这个问题，例如不使用 <a> 元素，但我想了解为什么 Firefox 的行为有所不同。

Answer 1

请改用此代码，firxfox 期望一个将事件作为参数传递给它的函数，但在您的代码中，调用 myfun() 返回的函数没有名为 event 的参数，因此它将返回未定义的参数，请使用此示例

$('#div, #link').click(myfunc());

function myfunc(){

	return function(event){
    if(event) { event.preventDefault(); }
    $('#result').show();
  }
  
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="div">Div</div>
<a id="link" href="#">Link</a>
<div id="result" style="display:none">Clicked</div>

Answer 2

传递你的函数但不要调用它。

function myfunc(event){
    if(event) { event.preventDefault(); }
    $('#result').show();
}

$('#div, #link').click(myfunc);