如何在JQuery函數中將事件作爲參數傳遞

您好我正在學習JQuery，並且我已經編寫了一個小函數，其中我使用按鈕的單擊事件附加了一個函數。如何在JQuery函數中將事件作爲參數傳遞

這是HTML

<script type="text/javascript"> 

    $(pageLoaded); 

    function pageLoaded() 
    { 
     $("#Button1").bind("click", 
          { key1: "value1", key2: "value2" }, 
          function buttonClick(event) 
          { 
           $("#displayArea").text(event.data.key1); 
          } 
          ); 
    }      

</script>

的頭元素這是HTML

<input id="Button1" type="button" value="button" /> 

<div id = "displayArea" style="border:2px solid black; width:300px; height:200px">

此代碼工作正常的身體。但是，當我嘗試在匿名方法外寫入buttonClick函數時，它不再起作用。

我試着這樣調用它：

$("#Button1").bind("click", 
        { key1: "value1", key2: "value2" }, 
        buttonClick(event)); 

function buttonClick(var event) 
{ 
     $("#displayArea").text(event.data.key1); 
}

這是行不通的。我是否在傳遞Event作爲參數時犯了一些錯誤？沒有使用匿名方法的正確方法是什麼？

來源

2012-06-29 Manas Saha

你需要傳遞function reference爲click處理程序，但你在這裏做什麼

$("#Button1").bind("click", 
        { key1: "value1", key2: "value2" }, 
        buttonClick(event));

立即調用buttonClick(event)和return undefined，並設置爲click handler。你必須通過一個函數引用，如buttonClick，你將自動獲得事件參數（jQuery將在調用處理函數時發送該參數）。

全碼：

$(function(){ 
    $("#Button1").bind("click", 
        { key1: "value1", key2: "value2" }, 
        buttonClick); 

    function buttonClick(event) 
    { 
     $("#displayArea").text(event.data.key1); 
    }  
});

演示：http://jsfiddle.net/joycse06/cjc9r/

更新（基於@ Tadeck的評論）：

您的代碼將，如果你工作得很好使用function expression l IKE在此

var buttonClick = function(event){ 
    $("#displayArea").text(event.data.key1); 
};

而且你必須把這個公司first use以上。在之前

$("#Button1").bind("click", ...

因爲function expressions這種情況下不hoisted在當前範圍內的像function declaration頂部。所以你可以使用它們only afterexpression已經interpretedJS interpreter。

來源

2012-06-29 09:16:16

+1爲是第一人，實際上說明他們在做什麼錯，而不是僅僅發佈的代碼進行傳遞。 –

+1。值得一提的是，如果你在這個答案中定義函數的方式，一切都會奏效。但是，如果你定義了這樣的函數：'var buttonClick = function（event）{...}'，那麼定義將需要放在使用「函數引用」之前（在這種情況下：在'$（「＃ Button1「）。bind（...）'被調用）。 – Tadeck

@Tadeck，謝謝先生，我可以在我的答案中加上這一點嗎？ –

有解決方案中的兩個錯誤，你將不得不改變

var只是用來定義一個變量而不是一個函數

function buttonClick(event) 
{ 
    $("#displayArea").text(event.data.key1); 
}

的參數的另一件事是，你要分配方式事件處理程序。您正在分配的返回值爲buttonClick(event)，這將是undefined。只需將它傳遞給函數本身。該event對象將自動jQuery的

$("#Button1").bind("click", 
        { key1: "value1", key2: "value2" }, 
        buttonClick);

來源

2012-06-29 09:17:27 Andreas

謝謝Andreas的解釋！ –

如何在JQuery函數中將事件作爲參數傳遞

回答

相關問題