javascript - 稍后如何触发 native 点击操作(重播事件)？

Question

我正在使用 jQuery 绑定(bind)到页面上的所有链接(我正在使用“点击”事件，但尝试了“mousedown”和“mouseup”的各种组合，以及 bind() 和 live()无济于事)。

我可以毫无问题地拦截点击(使用上述所有方法)。我想做的是通过 GET 请求发送一些数据，当它完成时，允许默认的点击操作继续。

由于跨域通信，我必须使用 GET 而不是 POST，因此无法进行同步调用。

因此，我必须从截获的点击事件中返回“false”，存储该事件供以后使用，然后在通信完成后再次手动触发它。如果我返回 true，通信将在页面位置更改时中途中断。

问题是，我找不到稍后触发 native 点击事件的方法。

var storedEvent;
$("#wrapper a").bind('click', function(event, processed) {
    $(event.target).unbind('click'); // temporary to make code branching easier
    storedEvent = event.target;
    event.stopPropagation();

    $.ajax({
        dataType: 'jsonp',
        data: linkData,
        jsonp: 'cb',
        url: 'xxx',
        cache: false,
        complete: function(response) {
            // How do I now go back and fire the native click event here?
            $(storedEvent).click();
        }
    });
    return false;
}

我试过在指示的地方使用 click() 和 trigger()，但都没有用。

我知道提交成功，代码分支正确——我已经调试到这里了。我似乎无法重播该事件。

请注意，我不能做一些简单的事情，例如存储 href 并稍后设置 window.location -- 一些链接有自己的 onClicks 集，而其他链接有指定的各种目标。理想情况下，我只想重播我之前停止的事件。

我开始将事件委托(delegate)与 live() 一起使用，并且一切正常，除此之外——我已将其简化为 bind() 以便简化问题。

Answer 1

最新答案:是的，您可以(假设您不再支持 IE8)。

使用dispatchEvent()触发原始事件的副本。

首先，您需要一个实用函数来克隆事件(因为出于安全原因，浏览器只允许分派(dispatch)一次事件):

var cloneNativeMouseEvent = function (original) {
    var copy;
    try {
        copy = new MouseEvent(original.type, original);
    } catch (stupidInternetExplorer) {
        copy = document.createEvent('MouseEvent');
        copy.initMouseEvent(original.type, original.bubbles, original.cancelable, original.view,
            original.detail, original.screenX, original.screenY, original.clientX, original.clientY,
            original.ctrlKey, original.altKey, original.shiftKey, original.metaKey, original.button,
            original.relatedTarget)
    }
    return copy;
};

在您的点击处理程序中存储对 jQuery 事件的引用以供以后重播:

$("#wrapper a").bind('click', function (event) {
    event.preventDefault();
    storedEvent = event;
    ...
}

最后，在你想再次触发点击的回调中，按如下方式进行:

var originalEventClone = cloneNativeMouseEvent(storedEvent.originalEvent);
storedEvent.target.dispatchEvent(originalEventClone);

请注意，通常情况下，由 JavaScript 创建或修改的事件会被用户代理标记为“不受信任”，因此它们无法触发默认操作。幸运的是，点击 事件是唯一的异常(exception)。 (1)