如何在JavaScript中模拟鼠标单击时设置目标属性?

11

我想在使用dojo的JavaScript代码中模拟鼠标单击事件。实际鼠标单击事件将使用"ondijitclick"进行注册。

我知道调用哪个方法/函数,并且我也有dijit对象来调用此方法。该方法需要一个函数对象作为参数,因此我正在创建一个新的MouseEvent对象。这一切都很好,只是我需要设置此事件的目标值,但我无法弄清如何做到这一点。这是必需的,因为稍后的异常处理将访问target属性,而我无法避免这种情况。

到目前为止,我拥有的代码:

    dojo.query(".mybutton").forEach(function (node) {
        var target = dojo.query(".myclass").parents("#" + node.id)[0];
        var event = new MouseEvent('click', {
            'view' : window,
            'bubbles': true,
            'cancelable': true
        });
        dijit.byId(node.id)._doEvent(event);
    });

如果我添加以下行

            'target' : target,
在MouseEvent创建时,属性不会被设置(但所有其他属性都会被设置),而目标属性将为null,但目标本身不为null。
是否有可能以某种方式设置目标属性?如果可能的话,我想知道我做错了什么?
编辑:
我发现了一个非常肮脏的解决方案,其中包括来自基础框架的小但不希望的更改。
我只能实现在target仍将为null的情况下设置relatedTarget属性。如果检查target属性是否为null,如果它为null,则在widget方法中获取relatedTarget,那么一切都按照所需工作。模拟点击和真正的点击都可以正常工作。
这种解决方案的唯一问题是我必须修改框架中的小部件。这是我们不会在发布版本中执行的操作。这个解决方案在一般情况下是可行的,但在实际情况下,这个解决方案对我们来说是不可接受的。
因此,问题仍然存在,即如何设置具有正确值的target属性。正如Ferry Kranenburg提出的解决方案所示,我看不出这是如何实现的。如果这个解决方案可以满足我的需求,如果有人能够向我解释这个技巧,那就太好了。
2个回答

15

当事件被初始化时,无法访问事件对象的target属性。它指向在触发事件后第一个接收该事件的元素,并由JavaScript内部设置为该元素。因此,如果您需要特定元素作为事件目标,则必须将事件分派到该元素。

一种方法是使用自己的方法覆盖本机target属性,但这可能会影响事件的冒泡行为。

dojo.query(".mybutton").forEach(function (node) {
  var target = dojo.query(".myclass").parents("#" + node.id)[0];
  var event = new MouseEvent('click', {
    'view' : window,
    'bubbles': true,
    'cancelable': true
  });
  Object.defineProperty(event, 'target', {value: target, enumerable: true});
  dijit.byId(node.id)._doEvent(event);
});

覆盖目标属性完美地工作,我目前没有注意到任何副作用。 - Onsokumaru
@MartinErnst 你确定 target 属性应该是 enumberable 吗? - kjb
@kjb - 取决于你的意图。在可枚举对象中,它通过事件属性在for-in循环中发挥作用,否则不会。 - Martin Ernst
@kjb - 而且:如果您想多次更改目标,则还必须定义:writable: true。 - Martin Ernst
这段代码能够与Event()对象一起使用吗? var target = $('#selector'); var event = new Event('keydown'); Object.defineProperty(event, 'target', {value: target});对我来说,这并没有设置目标值。它仍然是null。 - Benison
@Benison 是的,'target' 在 {value: target} 中需要是你正在动态分配到该事件的目标元素。 - pzelenovic

0

首先,您需要创建一个事件。在这里查看如何模拟鼠标事件。


我不确定那是否是我想要的。我只想创建事件参数并将它们传递给已经存在的函数。我在想为什么我不能设置目标,而我可以设置其他属性,如“view”。使用上述方法,我无法对“ondijitclick”做出反应,“onclick”也无法帮助,因为我无法修改原始对象,并且“onclick”没有调用我需要调用的函数。 - Onsokumaru

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接