Botón de imagen dentro del formulario, no desea enviar

Question

Tengo un formulario con un botón de imagen dentro, y este botón de imagen está enviando el formulario. ¿Cómo anulo esta funcionalidad?

<form><input type="image" src="/images/arrow.png" id="imageButton" onClick="javascript:autofill();"/></form> 

Answer 1

¿Por qué no acaba de tener una imagen? return false también detendrá la acción de envío de formulario.

<form><input type="image" src="/images/arrow.png" id="imageButton" onClick="autofill();return false;"/></form> 

Answer 2

simplemente devuelva falso después de su función de autocompletar().

onclick="autofill();return false;" 

Answer 3

¿Por qué utilizar un elemento de entrada en absoluto? Yo habría pensado simplemente utilizando una imagen con un evento onclick sería más apropiado si no quiere causar ningún enviar o restablecer el comportamiento

<image src="/images/arrow.png" onclick="javascript:autofill();" width="xxx" height="xxx" alt="Autofill" /> 

Answer 4

intenta utilizar event.preventDefault abortar presentar el evento clic de botón

por ejemplo:

$("#idButton").click(function(event) { 
    if(!valid) 
    { 
     //stopEvent 
     event.preventDefault(); 

    } else { 
     //submit your form 
     $("#form").submit(); 
    } 
}); 

Answer 5

¿quieres desactivar el botón después haga clic en el botón/imagen enviar?

si está usando php se puede usar el siguiente código o añadir disabled="disabled" deshabilitar el botón, siempre y cuando se mantenga en su formulario de entrada ..

<?php if (isset($disable) && $disable === true) echo ' disabled="disabled"'; ?> 

cómo añadir mi código

si usted utiliza su línea de código con un tipo de imagen:

intento:

<form><input type="image" src="/images/arrow.png" id="imageButton" onClick="javascript:autofill();" <?php if (isset($disable) && $disable === true) echo ' disabled="disabled"'; ?> /></form>

favor, lea this answer de mí (JAGB) también si desea utilizar una imagen sin javascript, la necesaria css se pueden encontrar en allí también.

Answer 6

Al hacer clic en el botón dentro de un formulario, envíe el formulario por defecto. Para cambiarlo, debe definir un botón con type = "button". Luego, puedes agregar el elemento img dentro de él. Esta es la mejor manera que encontré para hacerlo.

<form> 
    <button type="button" id="imageButton" onclick="javascript:autofill();"> 
     <img src="images/arrow.png"> 
    </button> 
</form>