可以使用jquery触发器设置event.data

前端之家收集整理的这篇文章主要介绍了可以使用jquery触发器设置event.data前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
使用jquery .on()可以传递一个可选参数来设置事件数据。你能用扳机做到这一点吗?

解决方法

简答:

可以触发()传递数据到你的事件处理程序吗?是(作为附加参数)

可以直接将trigger()传入event.data对象的数据吗?否(只有on()这样做)

// Using this will pass myData to every event handler as the second parameter. 
trigger('myEvent',[myData]) 
// Instead of this
on('myEvent',function(evt) {...});
// You would do this
on('myEvent',function(evt,myData) {...});

长答案

trigger()方法有5个主要的东西。

>它创建一个JQueryEventObject类型和可选的命名空间
>它发送或发出一个特定类型的事件,它沿着DOM向上移动,直到它到达顶部或者它的传播被停止。
>它定义了该类事件的事件处理程序的签名。

> function(event){…}是默认值

>它将事件作为第一个参数传递给这些处理程序
>它(可选)将附加参数传递给事件的任何处理程序

> function(event,additionalParams){}

数字3和5是最重要的,与你相关。由于您隐式定义了用于处理此事件的api,因此您希望与触发事件的方式保持一致,以便使用您的代码用户可以与其使用方式保持一致。

实施例1稠度

function Car(speed,tires,brakes) {
    this.speed = speed;
    this.tires = tires;
    this.brakes = brakes;
}

Car.prototype.brake = function(amount) {
    // You can do this (Event handler will have access to these parameters)
    car.trigger('brake.car',[this.speed,this.brakes,this.tires,amount])
    // Or this (Event handler will have access to these parameters)
    car.trigger('brake.car',[this,amount])
    // but try not to mix and match with the same event type
}
...
//This is the first way from above (choose one or the other,but don't mix and match).
passenger.on('brake.car',{person: passenger},carSpeed,carBrakes,carTires,brakeAmount){
    if(brakeAmount > 50)
        passenger.hangOnTight();
    }
})

...
// This is the second way from above (choose one or the other,car,brakeAmount){
    if(brakeAmount > 50)
        passenger.hangOnTight();
    }
})

示例2这是显示trigger()和on()的典型示例:

jQuery(document).on('eventName' {eventData1: 'foo',eventData2: 'bar'},function (evt,extraParam1,extraParam2) {
    //This code runs when the event is triggered
    console.log(evt.data.eventData1) // foo
    console.log(evt.data.eventData2) // bar
    console.log(extraParam1) // 'extra param 1'
    console.log(extraParam2) // 'extra param 2'
});

jQuery(document).trigger('eventName',['extra param 1','extra param 2']);

所以只要记住。

> .trigger():如果需要,发出事件并定义参数2,3等> .on():event是冒泡的dom。做一些东西,添加或使用事件数据,并使用触发添加或不添加的额外的参数。

原文链接:https://www.f2er.com/jquery/185100.html

猜你在找的jQuery相关文章