jQuery - 調用內聯函數

Question

我想將一個變量傳遞給內聯的jQuery函數（即：在實際鏈接（這是一個圖像映射中的區域標記）內使用onMouseOver="function();"））。

該函數只在被調用時才放在$(document).ready(function(){行之前，但這樣做會導致jQuery出現各種問題。

所有我想要的是一個簡單的標籤（如<area shape="circle" coords="357,138,17" onMouseOver="change('5');" id="5" />推出所包含的代碼的正常jQuery的體內功能。

非常感謝您能提供任何幫助。

爲了說明這一點，以下工作：

<script type="text/javascript"> 
function myfunction(x) { alert(x); //Alerts 2 
} 
</script> 

<img src="/shared_images/loading.gif" border="0" usemap="#Map"> 
<map name="Map"><area shape="rect" coords="171,115,516,227" 
onMouseOver="myfunction('2')"></map> 

但是下面沒有

<script type="text/javascript" src="scripts/jquery.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
function myfunction(x) { alert(x); //Nothing happens 
} 
} 
</script> 

<img src="/shared_images/loading.gif" border="0" usemap="#Map"> 
<map name="Map"><area shape="rect" coords="171,115,516,227" 
onMouseOver="myfunction('2')"></map> 

Answer 1

在你的第二個例子中，你聲明瞭myfunction裏面的你傳遞給.ready()的匿名函數。這意味着myfunction是一個局部變量，它只在該匿名函數的範圍內，並且不能在其他地方調用它。

有兩種解決方案。

首先，您可以在.ready()的調用之外（之前或之後）聲明它。這個不應該對jQuery造成任何干擾。如果確實如此，還有其他的錯誤（也許是一個簡單的語法錯誤？），我們歡迎您在StackOverflow問題中提出。

其次，您不應該使用onMouseOver=""附加事件處理程序（因爲這會將JavaScript與HTML混合在一起），所以讓我們完全消除它。這種替換您的JavaScript：

$(document).ready(function() { 
    $("#that-area-down-there").mouseover(function() { 
     alert(2); 
    }); 
}); 

和你的HTML這一點：

<area shape="rect" coords="171,115,516,227" id="that-area-down-there" /> 

（想必你會想取代id的東西在上下文中更有意義，當然）

Answer 2

爲什麼代碼不起作用有兩個答案。首先，您在調用ready函數時錯過了右括號，因此會出現語法錯誤。

其次，函數內部定義的函數只存在於該範圍內。當你退出該功能時，它不再存在。

例子：

$(document).ready(function(){ 
    function myfunction(x) { 
     alert(x); 
    } 
    myfunction(42); // here it works 
} 

myfunction(-1); // here it doesn't exist 

可以從這樣的功能在全球範圍內定義函數：

$(document).ready(function(){ 
    myfunction = function(x) { 
    alert(x); 
    } 
});