2012-08-06 6 views
6

El HTML es:Necesito ejecutar dos funciones onclick. No puedo conseguir que ambos trabajan juntos incluso cuando anidado

<input name="submit" 
     type="submit" 
     class="button" 
     value="Click Here" 
     tabindex="13" 
     onclick="return ValidateForm();" /> 

La función ValidateForm() tiene todo el código de validación de forma habitual. La otra función que no puedo llegar a funcionar (excepto por sí mismo funciona fine..example

<input name="submit" 
     type="submit" 
     class="button" 
     value="Click Here" 
     tabindex="13" 
     onclick="disDelay(this);" /> 

me gustan los dos intentado poner después de la onclick ... ejemplo

<input name="submit" 
     type="submit" 
     class="button" 
     value="Click Here" 
     tabindex="13" 
     onclick="return ValidateForm(); disDelay(this);" /> 

También probé poner un código en la misma función sin éxito.

la función disDelay() es

function disDelay(obj){ 
    obj.setAttribute('disabled','disabled'); 
    setTimeout(function(){obj.removeAttribute('disabled')},10000); 
} 

Se utilizará como un retraso para evitar que el formulario reciba envíos duplicados de múltiples clics. La demora es de 10 segundos en este momento solo para fines de prueba. Necesito la validación y la demora para trabajar juntos.

+1

'element.onclick = function() {function01(); function02(); }; 'no coloque eventos en html: D – ZiTAL

+0

¿cuál es el comportamiento que está observando? – laker

+0

No validará o retrasará cuando use incorrectamente ambas funciones con onclick. Cuando uso solo una de las funciones o la otra funciona bien, pero necesito ambas. – Allison

Respuesta

4

Al devolver el valor de la primera función finaliza el controlador de clic. En esencia, esto es lo que está haciendo en su intento de combinar:

<input name="submit" type="submit" class="button" 
     value="Click Here" tabindex="13" 
     onclick="return submit_Click(this);" /> 

<script type="text/javascript"> 
    function submit_Click(sender) { 
     return ValidateForm(); 
     disDelay(sender); // !!! This call is unreachable !!! 
    } 
</script> 

Aquí es una opción sencilla para corregirlo:

<input name="submit" type="submit" class="button" 
     value="Click Here" tabindex="13" 
     onclick="return submit_Click(this);" /> 

<script type="text/javascript"> 
    function submit_Click(sender) { 
     var r = ValidateForm(); 
     disDelay(sender); // It seems like you would only want to call this 
          // function if the form is validate, so there should 
          // probably be an if-statement surrounding it. However, 
          // I'll leave that up to you. 
     return r; 
    } 
</script> 
+0

¡Muchas gracias! Parece estar funcionando perfectamente. – Allison

2

Casi lo tenía, simplemente invertir el orden de la función llamadas.

<input name="submit" type="submit" class="button" value="Click Here" tabindex="13" onclick="disDelay(this); return ValidateForm(); " /> 

El regreso de ValidateForm va a hacer que el resto del código sea inalcanzable por lo que debe ser el último.

0

En su cadena onclick no se llama a la opción de distender (this) porque usted devuelve la respuesta de ValidateForm(), por lo que la segunda declaración nunca se ejecuta.

Si es absolutamente necesario utilizar el atributo onclick dentro del html, intente:

<input name="submit" type="submit" class="button" value="Click Here" tabindex="13" onclick="disDelay(); return ValidateForm();" /> 
Cuestiones relacionadas