para link form etiqueta crear codigo botones javascript html

javascript - link - form html



Botón HTML para NO enviar el formulario (6)

Tengo un formulario. Fuera de esa forma, tengo un botón. Un simple botón, como este:

<button>My Button</button>

Sin embargo, cuando hago clic en él, se envía el formulario. Aquí está el código:

<form id="myform"> <input /> </form> <button>My Button</button>

Todo lo que este botón debe hacer es un poco de JavaScript. Pero incluso cuando se ve como en el código anterior, envía el formulario. Cuando cambio el botón de etiqueta para abarcar, funciona perfectamente. Pero desafortunadamente, tiene que ser un botón. ¿Hay alguna forma de bloquear ese botón para que no envíe el formulario? Como por ejemplo

<button onclick="document.getElementById(''myform'').doNotSubmit();">My Button</button>


Creo que esta es la peculiaridad más molesta de HTML ... Ese botón debe ser del tipo "botón" para no enviar.

<button type="button">My Button</button>


Dave Markle tiene razón. Desde el sitio web de W3School :

Siempre especifique el atributo de tipo para el botón. El tipo predeterminado para Internet Explorer es "button", mientras que en otros navegadores (y en la especificación W3C) es "submit".

En otras palabras, el navegador que está utilizando está siguiendo las especificaciones de W3C.


Por defecto, los botones html envían un formulario.

Esto se debe al hecho de que incluso los botones ubicados fuera de un formulario actúan como remitentes (consulte el sitio web de W3Schools: http://www.w3schools.com/tags/att_button_form.asp )

En otras palabras, el tipo de botón es "enviar" por defecto

<button type="submit">Button Text</button>

Por lo tanto, una forma fácil de evitar esto es usar el tipo de botón .

<button type="button">Button Text</button>

Otras opciones incluyen devolver falso al final de onclick o cualquier otro controlador para cuando se hace clic en el botón, o para usar una etiqueta <input> en su lugar

Para obtener más información, consulte la información de la Red de desarrolladores de Mozilla en los botones: https://developer.mozilla.org/en/docs/Web/HTML/Element/button


Por razones de accesibilidad, no pude lograrlo con varios botones type=submit . La única forma de trabajar de forma nativa con un form con varios botones, pero SOLO uno puede enviar el formulario al presionar la tecla Enter es asegurarse de que solo uno de ellos sea de type=submit mientras que otros estén en otro tipo, como el type=button . De esta manera, puede beneficiarse de la mejor experiencia de usuario al tratar con un formulario en un navegador en términos de compatibilidad con el teclado.


Se recomienda no usar la etiqueta <Button> . Use la etiqueta <Input type=''Button'' onclick=''return false;''> lugar. (El uso del "retorno falso" no debe enviar el formulario).

Algun material de referencia


return false; al final del controlador onclick hará el trabajo. Sin embargo, es mejor simplemente agregar type="button" al <button> , de esa manera se comporta correctamente incluso sin JavaScript.