JQuery 自動觸發事件

標籤：blog   io   使用   java   資料   div   cti   sp   代碼   

 常用類比

有時候，需要通過類比使用者操作，來達到單擊的效果。例如在使用者進入頁面後，就觸發click事件，而不需要使用者去主動單擊。

在JQuery中，可以使用trigger()方法完成類比操作。例如可以使用下面的代碼來觸發id為btn的按鈕的click事件。

$(‘#btn‘).trigger("click");

　　

這樣，當頁面載入完畢後，就會立刻輸出想要的效果。也可以直接簡寫click()，來達到同樣的效果：

$(‘#btn‘).click();

　　

觸發自訂事件

trigger()方法不僅能觸發瀏覽器支援的具有相同名稱的事件，也可以觸發自訂名稱的事件。例如為元素繫結一個“myClick”的事件，JQuery代碼如下：

$(‘#btn‘).bind("myClick", function(){　　$(‘#test‘).append("<p>我的自訂事件.</p>");});

　　

想要觸發這個事件，可以使用以下代碼來實現：

$(‘#btn‘).trigger("myClick");

　　

傳遞資料

trigger(type[，data])方法有兩個參數，第1個參數是要觸發的事件類型，第2個參數是要傳遞給事件處理函數的附加資料，以數組形式傳遞。通常可以通過傳遞一個參數給回呼函數來區別這次事件是代碼觸發的還是使用者觸發的。

下面是一個傳遞資料的例子。

$(function(){　　$(‘#btn‘).bind("myClick", function(event, message1, message2){　　        $(‘#test‘).append( "<p>"+message1 + message2 +"</p>");       });    $(‘#btn‘).click(function(){　　    $(this).trigger("myClick",["我的自訂","事件"]);　　}).trigger("myClick",["我的自訂","事件"]);})       

　　

執行預設操作

trigger()方法觸發事件後，會執行瀏覽器預設操作。例如：

$("input").trigger("focus");

以上代碼不僅會觸發為<input>元素繫結的focus事件，也會使<input>元素本身得到焦點（這是瀏覽器的預設操作）。

如果只想觸發綁定的focus事件，而不想執行瀏覽器預設操作，可以使用jQuery中另一個類似的方法——triggerHandler()方法。

$("input").triggerHandler("focus");

該方法會觸發<input>元素上綁定的特定事件，同時取消瀏覽器對此事件的預設操作，即文字框只觸發綁定的focus事件，不會得到焦點。

 

JQuery 自動觸發事件