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用更具意义的东西来代替它.)