Tutoriel d'utilisation de la fonction jQuery.trigger()

Selon les commentaires de l'internaute @Feiyang, le déclencheur ("clic") de la balise de lien est un cas particulier et ne déclenchera pas le comportement par défaut de l'événement de clic de lien - passez à l'opération du lien correspondant, cliquez sur Afficher les détails associés ici.

events Le type de chaîne spécifie le type d'événement et un espace de noms facultatif, tel que "click", "focus", "keydown" .monPlugin".

extraArguments Le type facultatif/objet correspond aux paramètres supplémentaires transmis par la fonction de traitement d'événements. Si vous souhaitez transmettre plusieurs paramètres, veuillez les transmettre sous forme de tableau.

Le type d'objet eventObject est un objet Event, utilisé pour déclencher la fonction de traitement d'événement transmise à l'objet. La fonction

trigger() transmettra un paramètre par défaut pour la fonction de traitement d'événement qui déclenche l'exécution, qui est l'objet Event représentant l'événement en cours.

Le paramètre extraArguments est utilisé pour transmettre davantage de paramètres supplémentaires à la fonction de gestion des événements. Si extraArguments est sous forme de tableau, chaque élément servira de paramètre à la fonction .

Valeur de retour

trigger()La valeur de retour de la fonction est de type jQuery et renvoie l'objet jQuery actuel lui-même.

Exemple et description

Veuillez vous référer au code HTML initial suivant :

<input id="btn1" type="button" value="点击1" />
<input id="btn2" type="button" value="点击2" />
<a id="a1" href="#">CodePlayer</a>
<div id="log"></div>

Tout d'abord, nous lions les événements au bouton ci-dessus et aux éléments puis utilisez la fonction trigger() pour déclencher directement des événements. Le code correspondant est le suivant :

var $log = $("#log");
function handler( event, arg1, arg2 ){
    var html = &#39;<br>触发元素#&#39; + this.id + &#39;的[&#39; + event.type +&#39;]事件，额外的函数参数为:&#39; + arg1 + &#39;, &#39; + arg2;
    $log.append( html );
}
var $buttons = $(":button");
// 为所有button元素的click事件绑定事件处理函数
$buttons.bind( "click", handler );
// 为所有a元素的click、mouseover、mouseleave事件绑定事件处理函数
$("a").bind( "click mouseover mouseleave", handler );
// 触发所有button的click事件
$buttons.trigger("click"); 
/*(追加文本)
触发元素#btn1的[click]事件，额外的函数参数为:undefined, undefined
触发元素#btn2的[click]事件，额外的函数参数为:undefined, undefined
*/
$("#btn1").trigger("click", "CodePlayer");
/*(追加文本)
触发元素#btn1的[click]事件，额外的函数参数为:CodePlayer, undefined
*/
// arg1 = "张三"， arg2 = 20
$("a").trigger("mouseover", ["张三", 20 ] );
/*(追加文本)
触发元素#a1的[mouseover]事件，额外的函数参数为:张三, 20
*/
$("a").trigger("mouseleave", { name: "张三", age: 18 } );
/*(追加文本)
触发元素#a1的[mouseleave]事件，额外的函数参数为:[object Object], undefined
*/
trigger()函数还可以根据传入事件处理函数的Event对象，来触发对应的事件。
var $btn1 = $("#btn1");
// 为btn1元素的click事件绑定事件处理函数
$btn1.bind( "click", function(event){
    alert("click1");    
});
// 为btn1元素的click事件绑定事件处理函数
// 如果传入了一个有效的额外参数，则再次触发click
$btn1.bind( "click", function(event, arg1){
    alert("click2");
    if(arg1)
        $(this).trigger( event );
});
// $btn1.trigger( "click" ); // 调用一次click1、调用一次click2
$btn1.trigger( "click", true ); // 调用两次click1、调用两次click2

De plus, la fonction trigger() peut également déclencher uniquement les événements qui contiennent un espace de noms spécifié (les espaces de noms sont uniquement pris en charge dans 1.4.3+) .

function A( event ){
    alert( 'A' );
}
function B( event ){
    alert( 'B' );
}
function C( event ){
    alert( 'C' );
}
var $btn1 = $("#btn1");
// 为btn1元素的click事件绑定事件处理函数
$btn1.bind( "click.foo.bar", A );
$btn1.bind( "click.test.foo", B );
$btn1.bind( "click.test", C );
// 触发btn1的click事件，不限定命名空间
$btn1.trigger("click"); // 触发A、B、C
// 触发btn1的包含命名空间foo的click事件
$btn1.trigger("click.foo"); // 触发A、B
// 触发btn1的包含命名空间test的click事件
$btn1.trigger("click.test"); // 触发B、C
// 触发btn1的同时包含命名空间foo和test的click事件
$btn1.trigger("click.foo.test"); // 触发B

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!