-
Cómo cambiar Forma Valor de campo con JavaScript
-
JavaScript es un lenguaje de script del lado del cliente que proporciona una variedad de funciones que permiten a los programadores cambian dinámicamente casi todos los aspectos de la interfaz de usuario de una página web. Muchas páginas web que los visitantes solicitan formularios web, por lo general con el propósito de recuperar y almacenar información. JavaScript se utiliza a menudo para ayudar a los usuarios formas de usuario enteros por rellenar previamente los valores del formulario comunes, mediante la validación de los datos del formulario para asegurar el formato correcto y los valores, y por cómo mostrar y ocultar campos de formulario y contenido.Instrucciones
1 Abra un editor de texto y crear un nuevo archivo con el nombre fillForm.html. Añadir algunas etiquetas HTML para el archivo que incluye una etiqueta abierta "<html>", una etiqueta abierta "<head>", un cierre "</ head>" etiqueta, un proceso abierto "<body>" etiqueta, un cierre "< / body> "etiqueta, y un cierre" etiqueta </ html> ". En conjunto, estas etiquetas implementan una página HTML básica.
<Html>
<Head> </ head>
<Body> </ body>
</ Html>
2 Añadir una etiqueta "<script>" entre la "<head>" y "</ head>" etiquetas y establecer el tipo de secuencia de comandos para "text / javascript".
<Html>
<Head>
<Script type = "text / javascript">
</ Script>
</ Head>
<Body> </ body>
</ Html>
3 Añadir una función de JavaScript entre el "<script>" y "etiquetas </ script>". Nombre del fillForm función () e incluir una llave de apertura "{" y un cierre corchete "}" para indicar dónde colocar el código de la función.
<Html>
<Head>
<Script type = "text / javascript">
función fillForm ()
{
}
</ Script>
</ Head>
<Body> </ body>
</ Html>
4 Editar la función fillForm () y utilizar una función getElemenById JavaScript para establecer el valor del campo de entrada con el valor id "formToFill" al texto "cambia el valor".
<Html>
<Head>
<Script type = "text / javascript">
función fillForm ()
{
. Document.getElementById ( "formToFill") value = "valor cambiado";
}
</ Script>
</ Head>
<Body> </ body>
</ Html>
5 Escriba un "<form>" etiqueta abierta entre el "<body>" y "</ body>" etiquetas HTML. Añadir un "<input>" etiqueta HTML a la forma y darle un id "formToFill" y un valor de "Valor Original". Cierre la etiqueta "</ form>" y guardar fillForm.html.
<Html>
<Head>
<Script type = "text / javascript">
función fillForm ()
{
. Document.getElementById ( "formToFill") value = "valor cambiado";
}
</ Script>
</ Head>
<Body>
<Form>
<Input id = valor "formToFill" = "valor original">
</ Form>
</ Body>
</ Html>
6 Añadir un "botón <>" etiqueta HTML para el archivo y añadir un evento onClick () con el botón que llama a la función fillForm (). Establecer el texto del botón de "Haga clic para cambiar el valor en el campo de entrada formToFill.". Cierre la etiqueta "</ botón>" y guardar y cerrar fillForm.html.
<Html>
<Head>
<Script type = "text / javascript">
función fillForm ()
{
. Document.getElementById ( "formToFill") value = "valor cambiado";
}
</ Script>
</ Head>
<Body>
<Form>
<Input id = valor "formToFill" = "valor original">
Botón <type = "button" onclick = "fillForm ()"> Haga clic para cambiar el valor en el campo de entrada formToFill. </ Botón>
</ Form>
</ Body>
</ Html>
7 Abra el archivo en un navegador web y haga clic en el botón para cambiar el texto en el campo de formulario de texto "Valor Original" a "valor cambiado".
Consejos y advertencias
- Utilice <label> en los formularios web para asegurar que los campos claramente identificables.
- Adición de texto a los campos es una forma útil para ayudar a los usuarios de los campos del formulario completo. El evento onfocus () se puede utilizar para borrar el texto una vez que el usuario empieza a escribir información real en el campo.
- La mayoría de los formularios web se utilizan para recopilar datos de usuarios y almacenar esos datos para un propósito futuro. Hay muchas opciones de base de datos disponibles que pueden trabajar con secuencias de comandos del lado del servidor, tales como MySQL, Oracle y SQL Server.
- Dinámicamente el cambio de valores en formas pueden sorprender a los usuarios. Asegúrese de enviar mensajes al usuario apropiadamente para evitar la confusión y frustración.
