html - Tipo de botón "botón" frente a "enviar"

html-input htmlbutton

Question

¿Hay alguna diferencia entre un button con type="button" vs type="submit" ? ¿Existen diferencias funcionales o es solo un nombre descriptivo para facilitar la lectura del código?

¿Es esto diferente de la input ?

Answer 1

De MDN :

type
El tipo del botón. Los valores posibles son:

• enviar : el botón envía los datos del formulario al servidor. Este es el valor predeterminado si el atributo no se especifica , o si el atributo se cambia dinámicamente a un valor vacío o no válido.
• restablecer : el botón restablece todos los controles a sus valores iniciales.
• botón : el botón no tiene un comportamiento predeterminado. Puede tener scripts del lado del cliente asociados con los eventos del elemento, que se activan cuando ocurren los eventos.

En cuanto a la diferencia entre el button y la input :

• Un button puede tener un valor separado como datos, mientras que para una input los datos y el texto del botón son siempre los mismos:

  <input type="button" value="Button Text"> <!-- Form data will be "Button Text" -->
  <button type="button" value="Data">Button Text</button>

• Un button puede tener contenido HTML (por ejemplo, imágenes), mientras que una input solo puede tener texto.

• Un button puede ser más fácil de distinguir de otros controles de input (como los campos de texto) en CSS. Tenga en cuenta la compatibilidad con el navegador hacia atrás.

  input {
  
  }
  button { /* Always works */
  
  }
  input[type=button] { /* Not supported in IE < 7 */
  
  }

Answer 2

Los botones se pueden estilizar mucho mejor que las entradas se pueden usar para etiquetas de anclaje (enlaces).

• Imágenes
• Contenido, etc.

Las entradas pueden lograr la misma funcionalidad que los botones pero un diseño más feo.

Digamos que las entradas son de la vieja escuela, los botones son más fríos.

Answer 3

Tienen un comportamiento predeterminado diferente con respecto al envío de datos de formulario al servidor. El botón tiene un atributo llamado "tipo" y puede contener esos valores:

submit : tiene el comportamiento predeterminado de enviar los datos del formulario al servidor. Este es el valor predeterminado si el atributo no se especifica, o si el atributo se cambia dinámicamente a un valor vacío o no válido.

botón : el botón no tiene un comportamiento predeterminado. Puede tener scripts del lado del cliente asociados con los eventos del elemento, que se activan cuando ocurren los eventos.

Answer 4

Un botón con el tipo "botón" no enviará un formulario, pero uno sin tipo o type = submit (el valor predeterminado) lo hará. Los botones con type = submit son casi lo mismo que las entradas con type = submit pero los botones pueden contener contenido HTML.

Answer 5

<button type="button"></button> no enviarán un formulario; no hacen nada de forma predeterminada. El botón no enviará el formulario por sí solo. Es un botón simple que se utiliza para realizar algunas operaciones mediante el uso de javascript, mientras que Enviar es un tipo de botón que, de forma predeterminada, envía el formulario cada vez que el usuario hace clic en el botón Enviar.