Detaillierte Erläuterung der Funktion jQuery.triggerHandler()

Die Funktion

triggerHandler() wird verwendet, um ein Ereignis des angegebenen Typs für jedes übereinstimmende Element auszulösen.

Darüber hinaus können Sie beim Auslösen des Ereignisses auch zusätzliche Parameter an die Funktion Ereignisbehandlung übergeben.

Diese Funktion funktioniert ähnlich wie die Funktion trigger(), die Funktion triggerHandler() weist jedoch die folgenden Ausnahmen auf:

triggerHandler() löst nicht das Standardverhalten des Ausführungselements aus (z. B das Standard-Link-Klick-Ereignis (Sprungverhalten, Standard-Übermittlungsverhalten des Formular-Übermittlungsereignisses).

triggerHandler() löst Ereignisse nur für das erste übereinstimmende Element im jQuery-Objekt aus.

Ereignisse, die durch triggerHandler() ausgelöst werden, sprudeln nicht im DOM-Baum nach oben, sodass das Ereignis nicht zu einem seiner Vorgängerelemente sprudelt. Der Rückgabewert von

triggerHandler() ist der Rückgabewert der entsprechenden Ereignisverarbeitungsfunktion , nicht das aktuelle jQuery-Objekt selbst.

Diese Funktion gehört zum jQuery-Objekt (Instanz).

Syntax

Diese Funktion wurde in jQuery 1.2 hinzugefügt.

jQueryObject.triggerHandler( events [, extraArguments ] )

Parameter

Parameterbeschreibung

events String-Typ gibt den Ereignistyp und den optionalen Namespace an , wie zum Beispiel „click“, „focus“, „keydown.myPlugin“.

extraArguments Optional/Objekttyp sind die zusätzlichen Parameter, die von der Ereignisverarbeitungsfunktion übergeben werden. Wenn Sie mehrere Parameter übergeben möchten, übergeben Sie diese bitte als Array. Die Funktion

triggerHandler() übergibt einen Standardparameter für die Ereignisverarbeitungsfunktion, die die Ausführung auslöst, nämlich das Ereignisobjekt, das das aktuelle Ereignis darstellt.

Der Parameter extraArguments wird verwendet, um weitere zusätzliche Parameter an die Event-Handling-Funktion zu übergeben. Wenn extraArguments in Array-Form vorliegen, dient jedes Element als Parameter der Funktion .

Rückgabewert

Der Rückgabewert der Funktion triggerHandler() ist von beliebigem Typ und gibt den Rückgabewert der Ereignisverarbeitungsfunktion zurück, die die Ausführung ausgelöst hat.

Beispiel und Beschreibung

Bitte beziehen Sie sich auf den folgenden anfänglichen HTML-Code:

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

Zuerst binden wir Ereignisse an die obige Schaltfläche und Verwenden Sie dann die Funktion triggerHandler(), um das Ereignis direkt auszulösen. Der entsprechende Code lautet wie folgt:

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 );
// 触发btn1的click事件
// 虽然$buttons匹配两个button元素，但只会触发第一个匹配元素的click事件
$buttons.triggerHandler("click");
/*(追加文本)
触发元素#btn1的[click]事件，额外的函数参数为:undefined, undefined
*/
$("#btn2").triggerHandler("click", "CodePlayer");
/*(追加文本)
触发元素#btn2的[click]事件，额外的函数参数为:CodePlayer, undefined
*/
// arg1 = "张三"， arg2 = 20
$("a").triggerHandler("mouseover", ["张三", 20 ] );
/*(追加文本)
触发元素#a1的[mouseover]事件，额外的函数参数为:张三, 20
*/
$("a").triggerHandler("mouseleave", { name: "张三", age: 18 } );
/*(追加文本)
触发元素#a1的[mouseleave]事件，额外的函数参数为:[object Object], undefined
*/

Führen Sie den Code aus (bitte kopieren Sie andere Codes zur Ausführung auf die Demoseite)

Die Funktion triggerHandler() kann auch entsprechend dem Objekt Enter the Event der Ereignisverarbeitungsfunktion übergeben werden, um das entsprechende Ereignis auszulösen.

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).triggerHandler( event );
});
// $btn1.triggerHandler( "click" ); // 调用一次click1、调用一次click2
$btn1.triggerHandler( "click", true ); // 调用两次click1、调用两次click2
此外，triggerHandler()函数还可以只触发包含指定定命名空间的事件(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.triggerHandler("click"); // 触发A、B、C
// 触发btn1的包含命名空间foo的click事件
$btn1.triggerHandler("click.foo"); // 触发A、B
// 触发btn1的包含命名空间test的click事件
$btn1.triggerHandler("click.test"); // 触发B、C
// 触发btn1的同时包含命名空间foo和test的click事件
$btn1.triggerHandler("click.foo.test"); // 触发B

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Funktion jQuery.triggerHandler(). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!