2009-09-05 11 views
20

Usar jQuery Quiero vincular una función existente a un botón. He estado a través de la documentación y he encontrado el método de enlace, pero los ejemplos en la jQuery unir las funciones de nueva creación, donde como lo desea enlazar una función que ya está codificado, por ejemplo:Enlazar una función de JavaScript existente en jQuery

function fHardCodedFunction(){ 
    //Do stuff 
} 

function fBindFunctionToElement(){ 
    $("#MyButton").bind("click", fHardCodedFunction()); 
} 


Es esto posible ? ¿O estoy yendo sobre esto de la manera incorrecta?

+0

Aquí está la sección relacionada de la documentación de la API de jQuery: [** Selector múltiple **] (https://api.jquery.com/multiple-selector/) – informatik01

Respuesta

33

El plano fHardCodedFunction ya se refiere a la función y el sufijo () simplemente lo llamará. Así que sólo tiene que pasar a la función en lugar de llamarlo y por lo tanto simplemente pasar el valor de retorno:

function fBindFunctionToElement(){ 
    $("#MyButton").bind("click", fHardCodedFunction); 
} 
+3

¿Qué sucede si necesito pasar la función codificada a ¿parámetro? –

+10

@Jack Mills: Entonces necesitarás usar una función de envoltura (anónima) como 'function() {return fHardCodedFunction (" foo "," bar "); } 'que pasa como función de devolución de llamada a' bind'. – Gumbo

+0

Esto es casi lo que estoy tratando de hacer (estoy usando .click() en cambio, pero por lo que yo sé, es lo mismo). Sin embargo, mi función enlazada no funciona: ¿la función enlazada tiene acceso a las mismas variables que la función click()? O tal vez al usar la sintaxis '$ (" # mydiv "), haga clic en (función() {$ (" # mydiv "). Hide();}', hay variables ocultas pasadas a la función? –

2

Sí se puede unir métodos que escriben en otro lugar, pero se debe hacer caso omiso de los paréntesis:

function fHardCodedFunction(){ 
    //Do stuff 
} 

function fBindFunctionToElement(){ 
    $("#MyButton").bind("click", fHardCodedFunction); 
} 
+0

¿Qué pasa si necesito? pasar la función codificada un parámetro? –

4

Préstamos de los otros puestos, se puede parametrizar el controlador de eventos de la siguiente manera:

function fHardCodedFunction(someValue) { 
    alert(this.id + " - " + someValue); 
} 


function fBindFunctionToElement() { 
    var someValue = "whatever"; 
    $("#MyButton").bind("click", 
     function() { 
     fHardCodedFunction.apply(this, [someValue]); 
     } 
); 
} 


$(document).ready 
(
    function() { 
    fBindFunctionToElement(); 
    } 
); 

estoy usando aplica en este caso porque en función de fHardCodedFunction me gustaría que el this propiedad para hacer referencia al elemento MyButton. Tenga en cuenta también que aplicar espera una matriz para el segundo parámetro, por lo que he ajustado someValue entre paréntesis.

No tiene que hacerlo de esta manera y puede olvidarse de esta propiedad this si lo prefiere.

Cuestiones relacionadas