Question

我希望在以下条件下从本机事件的处理程序中触发自定义事件：

我希望处理程序的格式为：function(event, arg) {}，其中
event是原始的原生活动（因此我可以致电event.preventDefault()）
arg是trigger er传递的一些数据（在原始事件的处理程序中）
两个事件（本机和自定义）都在同一元素上触发（因此自定义事件的名称必须与原始事件的名称不同）

我能够做到这一点，它有效：

// the native event handler 
function(event) {
    var e = jQuery.Event("some_custom_event");
    e.foo = 'bar';
    $(this).trigger(e);
    if (e.isDefaultPrevented())
        event.preventDefault();
}

// an example handler for the custom event:
function (event) {
    alert(event.foo);
    event.preventDefault();
}

我想我也可以将原始事件和foo作为参数传递给自定义事件处理程序，但我想要一个标准的处理程序（没有function(event1,event2）。

我想在jQuery中轻松完成所需的工作吗？

Answer 1

trigger函数有2种风格，我认为你应该看一下语法.trigger( eventType [, extraParameters] )的第一种。

如果我理解正确，那么您需要做的是将foo作为附加参数传递，如下所示

$(this).trigger(e, [foo]);

下面是jQuery文档的一个例子，

$("p").click( function (event, a, b) {
// when a normal click fires, a and b are undefined
// for a trigger like below a refers to "foo" and b refers to "bar"

} ).trigger("click", ["foo", "bar"]);

来自文档.. read more..

.trigger（eventType [，extraParameters]）

eventType包含JavaScript事件类型的字符串，例如click或   提交。

extraParameters传递给事件的附加参数   处理程序。

Answer 2

您可以创建一个JQuery事件（$.Event），该事件将允许event.preventDefault()，并将在事件触发后获得荣誉或接听。

因此，首先在插件/函数中创建事件，并触发它：

var event = $.Event('myCustomEvent');
$element.triggerHandler(event, [extraData1, extraData2]);

然后在你的处理程序中，你可以访问你的extraData和preventDefault;

$('#someElement').on('myCustomEvent', function (event, extraData1, extraData2) {
   event.preventDefault();
};

现在您可以在原始触发器之后检查以查看默认值;

var event = $.Event('myCustomEvent');
$element.triggerHandler(event, [extraData1, extraData2]);

if (event.isDefaultPrevented()) {
    /* Do something as user prevented default */
} else {
    /* Proceed as normal */
};

如何在jQuery中触发自定义事件，传递原始事件和数据

2 个答案: