jQuery:如何在事件处理函数中获取事件对象而不将其作为参数传递?

IT技术 javascript jquery events object
2021-01-21 00:31:49

我的onclick链接上有一个属性:

<a href="#" onclick="myFunc(1,2,3)">click</a>

这指向 JavaScript 中的这个事件处理程序:

function myFunc(p1,p2,p3) {
    //need to refer to the current event object:
    alert(evt.type);        
}

既然事件对象“evt”没有传递给参数,那么还有可能获取到这个对象吗?

我试过window.event$(window.event),但都是undefined

任何的想法?

4个回答

既然没有从参数中传递事件对象“evt”,那么还有可能获取到这个对象吗?

不,不可靠。IE 和其他一些浏览器将其作为window.event(not $(window.event)) 提供,但这是非标准的,并非所有浏览器都支持(众所周知,Firefox 不支持)。

您最好将事件对象传递给函数:

<a href="#" onclick="myFunc(event, 1,2,3)">click</a>

这甚至适用于非 IE 浏览器,因为它们在具有event变量的上下文中执行代码(并且适用于 IE,因为event解析为window.event)。我已经在 IE6+、Firefox、Chrome、Safari 和 Opera 中尝试过。示例:http : //jsbin.com/iwifu4

最好的办法是使用现代事件处理:

HTML:

<a href="#">click</a>

使用 jQuery 的 JavaScript(因为您使用的是 jQuery):

$("selector_for_the_anchor").click(function(event) {
    // Call `myFunc`
    myFunc(1, 2, 3);

    // Use `event` here at the event handler level, for instance
    event.stopPropagation();
});

...或者如果你真的想event进入myFunc

$("selector_for_the_anchor").click(function(event) {
    myFunc(event, 1, 2, 3);
});

选择器可以是任何标识锚点的东西。您有一个非常丰富的集合可供选择(几乎所有的 CSS3,还有一些)。您可以向锚点添加idclass,但同样,您还有其他选择。如果您可以使用它在文档中的位置而不是添加一些人为的东西,那就太好了。

感谢您的解释,这部分 javascript 一直让我感到困惑。这个无形的、神秘的“事件”参数从无处传入的想法从来没有向我解释得很好。
2021-03-28 00:31:49

在 IE 中,您可以通过window.event 在其他浏览器中不带'use strict'指令的方式获取事件对象,可以通过arguments.callee.caller.arguments[0].

function myFunc(p1, p2, p3) {
    var evt = window.event || arguments.callee.caller.arguments[0];
}
这行不通。该函数是在没有事件参数的情况下从事件处理程序中显式调用的,因此不能作为参数访问。
2021-03-19 00:31:49
是的,不鼓励被调用者和调用者,但当事件处理代码与 HTML 内联时,这是访问 Event 对象的唯一方法,最好的方法是始终使用 javascript 不引人注意地注册事件:)
2021-03-21 00:31:49
我在 Chrome 上对其进行了测试,它可以工作,Event 对象是 HTML 内联事件的隐式参数,并且arguments.callee.caller是 HTML 生成的匿名事件处理函数,它的第一个参数是隐式的 Event 对象
2021-03-28 00:31:49
arguments.callee.caller.arguments 仍然期望事件作为参数/参数传递。
2021-03-31 00:31:49
arguments.callee.caller没有得到普遍支持,在某些支持它的实现中速度非常慢,是一个非常糟糕的主意,并且在严格模式下是不允许的。
2021-04-11 00:31:49

像这样编写您的事件处理程序声明:

<a href="#" onclick="myFunc(event,1,2,3)">click</a>

然后您的“myFunc()”函数可以访问该事件。

“onclick”属性的字符串值转换为函数的方式与浏览器(内部)调用函数构造函数几乎完全相同:

theAnchor.onclick = new Function("event", theOnclickString);

(IE 除外)。但是,因为“事件”在 IE 中是一个全局变量(它是一个窗口属性),所以您可以在任何浏览器中以这种方式将其传递给函数。

在 FF 中测试过,你是对的,它失败了。在大量反对票到来之前删除了帖子。谢谢你的提醒:)
2021-04-03 00:31:49

如果你在标记上调用你的事件处理程序,就像你现在所做的那样,你不能 (x-browser)。但是如果你用jquery绑定click事件,可以通过以下方式:

标记:

  <a href="#" id="link1" >click</a>

Javascript:

  $(document).ready(function(){
      $("#link1").click(clickWithEvent);  //Bind the click event to the link
  });
  function clickWithEvent(evt){
     myFunc('p1', 'p2', 'p3');
     function myFunc(p1,p2,p3){  //Defined as local function, but has access to evt
        alert(evt.type);        
     }
  }

自从事件ob

“如果你在标记上调用你的事件处理程序,就像你现在所做的那样,你不能(x-browser)。” 实际上,您可以(请参阅我的回答;这适用于所有主要浏览器和我尝试过的所有次要浏览器——IE6+、Firefox、Chrome、Safari、Opera...)。但最好不要这样做。
2021-03-18 00:31:49
但是在您的解决方案中,您是event作为参数发送的,而 LazNiko 的要求是不要这样做。一定有另一种方式,但由于提问者已经离开,它毫无value:S
2021-03-27 00:31:49
一种方法(使用标记)确实是clickWithEvent从标记调用函数,但是,正如我们所知,从标记调用不是最好的方法(最终会是相同的解决方案)。
2021-03-31 00:31:49