jQuery - Llamar a una función en línea

Question

Estoy tratando de pasar una variable a una función jQuery en línea (es decir, usando un onMouseOver="function();" dentro del enlace real (que es una etiqueta de área desde un mapa de imagen)).

La función solo se invoca si la coloco antes de la línea $(document).ready(function(){, pero esto causa todo tipo de problemas con jQuery.

Todo lo que quiero es una simple etiqueta (como <area shape="circle" coords="357,138,17" onMouseOver="change('5');" id="5" /> para poner en marcha una función que está contenida dentro del cuerpo normal de jQuery de código.

Muchas gracias por cualquier ayuda que pueda ofrecer.

Para ilustrar el punto, las siguientes obras:

<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> 

pero el siguiente no lo hace

<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

En su segundo ejemplo, ha declarado myfunctiondentro de la función anónima que está pasando al .ready(). Eso significa que myfunction es una variable local, que solo está dentro del alcance dentro de esa función anónima, y ​​no puedes llamarla desde ningún otro lado.

Hay dos soluciones.

Primero, puede declararlo fuera (antes o después) de la llamada al .ready(). Esto no debería causar ninguna interferencia con jQuery. Si lo hace, algo más está mal (¿quizás un simple error de sintaxis?) Que le invitamos a plantear en una pregunta de StackOverflow.

En segundo lugar, no debe utilizar onMouseOver="" para adjuntar controladores de eventos (ya que eso mezcla JavaScript con HTML), así que eliminemos por completo. Reemplazar el JavaScript con esto:

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

Y su HTML con esto:

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

(. Es de suponer que usted quiere reemplazar ese id con algo más significativo en el contexto, por supuesto)

Answer 2

Hay dos resons por qué el código no funciona. En primer lugar, falta un paréntesis de cierre en la llamada a la función lista, por lo que se obtiene un error de sintaxis.

En segundo lugar, la función que defina dentro de la función solo existe en ese ámbito. Cuando sale de la función ya no existe.

Ejemplo:

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

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

Se puede definir la función a nivel mundial dentro de la función así:

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