Atributo del botón HTML Tipo = enviar

Atributo del botón HTML Tipo = enviar

HTML se utiliza para hacer que la estructura de la página web, y los idiomas de secuencias de comandos como JavaScript se utilizan para que la página web sea más interactiva y dinámica. Además, HTML ofrece diferentes atributos a sus elementos que ayudan a codificar JavaScript. Por ejemplo, necesitamos formularios en casi todas las aplicaciones para ingresar información. Para enviar datos de formulario al servidor, se requiere tener un botón que obtenga la información escrita y lo enviará a JavaScript para su posterior procesamiento.

Esta guía enseñará sobre el HTML ""Tener valor de atributo"entregar". Entonces, vamos a sumergirnos!

Cómo agregar el atributo de type de botón HTML = "enviar"?

En html, primero, agregue un nombre de clase "myform". Luego, realice los siguientes pasos:

  • Dentro del div, agrega

    Etiqueta para el encabezado.

  • Luego, agregue dos cuadros de texto para el primer y apellido con etiquetas. El "para"Atributo del"etiqueta"Etiqueta y el"identificación"Atributo del"aporte"La etiqueta debe ser la misma. Esto asociará el subtítulo con el control de entrada.
  • Agregue un botón con el "tipo"Valor establecido como"entregar","valor" como "entregar", y "identificación" como "entregar".
  • Después de eso, asocie el "agregar datos()"Función con el botón Enviar, que se activará cuando se haga clic en el botón. Este formulario tomará los datos del usuario y los mostrará en la misma página.
  • Por último, especificar

    Etiquetas donde se deben mostrar los datos enviados. Estos

    Las etiquetas han asignado ID como "displayfname" y "DisplayLName"Eso se utilizará en el archivo JavaScript para acceder a ellos y realizar la operación adicional.

Html


El atributo de "enviar" de tipo de botón











Ha enviado el primer nombre:> __________.

Ha enviado apellido:> ___________.


Aplicemos algunos estilos CSS al div mencionado anteriormente. Aquí el ".myform"Se refiere al nombre Div mencionado en el archivo HTML:

  • Asignar el "color de fondo"Valor de propiedad como"#81B29A".
  • "texto alineado" como "centro"Alinea el contenido del div en el centro.
  • El "altura"El valor de la propiedad se establece como"300px".
  • "tamaño de fuente"Está configurado como"grande".

CSS

.myForm
Color de fondo: #81B29A;
Text-Align: Center;
Altura: 300px;
tamaño de fuente: grande;

Nota: No hemos agregado el código JavaScript. Como resultado, el botón Enviar no responderá:

Ahora, avancemos para codificar la función JavaScript que se activará en el botón Haga clic. Para hacerlo, en primer lugar, cree un nuevo archivo que tenga una extensión como ".js". Luego, defina una función llamada "agregar datos()". Esta función primero obtendrá el valor de ambos campos de entrada accediendo a ellos utilizando sus ID en el documento.método getElementById (). Luego, muestre el valor recuperado como el texto interno de las etiquetas agregadas.

Javascript

función addData ()
var fname = documento.getElementById ("fname").valor;
var lname = documento.getElementById ("lname").valor;
documento.getElementById ("Displayfname").inteText = fname;
documento.getElementById ("DisplaylName").inteText = lname;

Se puede observar que después de ingresar al primer y apellido cuando el "EntregarSe hace clic en el botón, los nombres se muestran en las etiquetas:

Hemos aprendido cómo las funciones del botón de envío HTML con demostración práctica.

Conclusión

En HTML, hay cientos de elementos como párrafos, campos de entrada, botones y más. Más específicamente, el elemento del botón HTML con el valor del atributo "entregar"Se utiliza para enviar los valores de datos al controlador de formulario o para procesar los valores de entrada. En esta guía, hemos utilizado el botón Enviar para invocar una función de JavaScript con ejemplos prácticos.