Botón HTML para NO enviar el formulario

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

<button>My Button</button>

Sin embargo, cuando hago clic en él, 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 exactamente como en el código anterior, envía el formulario. Cuando cambio el botón de etiqueta para abarcar, funciona perfectamente. Pero desafortunadamente, debe ser un botón. ¿Hay alguna forma de impedir que ese botón envíe el formulario? Como por ejemplo

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

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

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

Actualización 5-feb-2019: según el estándar de vida HTML (y también la especificación HTML 5 ):

El valor predeterminado valor faltante y por defecto valor no válido son el estado del botón Submit.

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 ningún JavaScript.

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 "botón", mientras que en otros navegadores (y en la especificación W3C) es "enviar".

En otras palabras, el navegador que está utilizando sigue las especificaciones del 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 manera 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 del 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 sobre botones: https://developer.mozilla.org/en/docs/Web/HTML/Element/button

Se recomienda no usar la <Button>etiqueta. Use la <Input type='Button' onclick='return false;'>etiqueta en su lugar. (El uso de "return false" no debería enviar el formulario).

Un poco de material de referencia

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

Otra opción que funcionó para mí fue agregar onsubmit = "return false;" a la etiqueta del formulario.

<form onsubmit="return false;">

Semánticamente probablemente no sea una solución tan buena como los métodos anteriores para cambiar el tipo de botón, pero parece ser una opción si solo desea un elemento de formulario que no se enviará.