JavaScript：模拟单击链接

Question

我有一个链接，它附加了一个监听器（我正在使用YUI）：

YAHOO.util.Event.on(Element, 'click', function(){ /* some functionality */});

我希望在不需要用户点击的情况下，在另一个场景中实现相同的功能。理想情况下，我只需模拟“点击”该元素，就可以自动触发功能。我该如何做到这一点？很遗憾，以下方法不起作用：

$('Element').click()

感谢您的选择。

- danny

Answer 1

MDC提供了一个很好的使用dispatchEvent模拟点击事件的例子。

以下是一些用于模拟元素点击的代码，它还会检查是否有东西取消了该事件：

function simulateClick(elm) {
  var evt = document.createEvent("MouseEvents");
  evt.initMouseEvent("click", true, true, window,
    0, 0, 0, 0, 0, false, false, false, false, 0, null);
  var canceled = !elm.dispatchEvent(evt);
  if(canceled) {
    // A handler called preventDefault
    // uh-oh, did some XSS hack your site?
  } else {
    // None of the handlers called preventDefault
    // do stuff
  }
}

- Eli Grey

---

这个非常好用，而且实现起来非常容易。谢谢！ - gramm

我需要使用YUI才能做到这一点吗？ - Colleen Kitchen

不，您不必使用YUI来使用此功能。 - Eli Grey

Answer 2

你正在寻找 fireEvent (IE) 和 dispatchEvent (其他浏览器)。

对于 YUI 3，所有这些都被包装得很好，使用 Y.Event.simulate() 即可。

YUI().use("node", function(Y) {
    Y.Event.simulate(document.body, "click", { shiftKey: true })
})

- Crescent Fresh

Answer 3

你可以单独声明函数。

function DoThisOnClick () {
}

然后像你现在做的一样将其分配给 onclick 事件，例如：

YAHOO.util.Event.on(Element, 'click', DoThisOnClick)

而且你可以在任何时候调用它 :-)

DoThisOnClick ()

- Ilya Birman

---

是的...但是YUI事件处理程序可以访问诸如“this”和其他由YUI框架处理的参数变量。最好只需触发相同的事件。 - danny

"this" 指向你所点击的对象的引用。如果你自己调用函数，就没有这样的对象。因此，你的函数需要处理它。尝试：if (this) // 做某事; else // 当没有“this”时做某事 - Ilya Birman

Answer 4

如果有人正在寻找一种与框架无关的方式来触发任何HTML和鼠标事件，请看这里：如何使用JavaScript模拟鼠标单击？

- TweeZz

Answer 5

1) 第一种解决方案

这篇文章http://mattsnider.com/simulating-events-using-yui/介绍了如何使用YAHOO模拟点击事件：

var simulateClickEvent = function(elem) {
    var node = YAHOO.util.Dom.get(elem);

    while (node && window !== node) {
        var listeners = YAHOO.util.Event.getListeners(node, 'click');

        if (listeners && listeners.length) {
            listeners.batch(function(o) {
                o.fn.call(o.adjust ? o.scope : this, {target: node}, o.obj);
            });
        }

        node = node.parentNode;
    }
};

正如您所看到的，该函数循环遍历节点及其父节点，并为每个节点获取侦听器列表并调用它们。

2）第二种解决方案

还有另一种方法可以实现。 例如：

var elem = YAHOO.util.Dom.get("id-of-the-element");
elem.fireEvent("click", {});

函数用于

3) 第三种解决方案

YUI2的2.9版本有一个更好的解决方案：http://yui.github.io/yui2/docs/yui_2.9.0_full/docs/YAHOO.util.UserAction.html

4) 第四种解决方案

YUI3也有一个更好、更干净的解决方案：http://yuilibrary.com/yui/docs/event/simulate.html

- Marco Altieri

Answer 6

当然，$('Element').click()不起作用，但如果您包含jquery，则可以使用它，并且它可以很好地与yui一起使用。

据我了解，您需要执行以下操作：

function myfunc(){
//functionality
}

YAHOO.util.Event.on(Element, 'click', myfunc);

然后在需要发生其他事情时调用myfunc函数。

- Vasil

Answer 7

无法模拟对任意元素的用户点击是有意为之的，原因显而易见。

- wombleton