Una plantilla HTML es típicamente uno o más documentos HTML que proporcionan un marco para un sitio web, pero que no incluyen ningún contenido. Un usuario puede comprar una plantilla HTML para crear una página web mediante la introducción de la información de contacto de la empresa y completar otras secciones en blanco en la plantilla con información específica para su compañía. Usted puede llamar JavaScript partir de una plantilla HTML de la misma forma que se dice que de cualquier archivo HTML. Instrucciones
1
Crear una plantilla HTML que incluye un formulario de contacto y llamar a JavaScript desde la plantilla para validar que el usuario introduce información en el formulario de contacto. Crear un nuevo archivo HTML utilizando el Bloc de notas o un editor HTML e introduzca la información del encabezado HTML en el archivo:
plantilla HTML < /title> <br> 2 <p> crear algún diseño para el mensaje de error se mostrará si no hay información se introduce en un campo en el formulario de entrada : <br> <p> <style> <br> <p> error {color : red ; fuente. - weight: bold ;} <br> <p> < /style> <br> 3 <p> Crear una función de JavaScript que se puede llamar desde la plantilla cuando el usuario envía el formulario HTML y voluntad validar que el usuario introduce información para cada campo de entrada . Referencia de los elementos de formulario individuales por sus nombres y los divs para los mensajes de error por parte de sus identificaciones . Devuelve true si la validación se ha realizado correctamente , y false si no se ha realizado correctamente : <br> <p> <script> <br> función <p> validar () { var <br> <p> NameError = document.getElementById ( " NameError "); <br> <p> emailError var = document.getElementById ( " emailError "); <br> <p> nameError.innerHTML = " "; <br> <p> emailError.innerHTML = " "; <br> <p> if ( document.contact.name.value == " ") { <br> <p> nameError.innerHTML = "Debe introducir un nombre " ; ! <br> <p> return false ; <br> <p> } <br> <p> if ( document.contact.email.value == " ") <br> { <p> emailError.innerHTML = "Debe introducir una dirección de correo electrónico " ; ! <br> < p > return false; } <br> <p> <br> <p> return true ; } <br> <p> <br> <p> < /script > <br> <p> < /head> <br> 4 <p> Crear el formulario HTML. Asigne el mismo nombre a la forma y los valores de entrada como se ha utilizado en la función de JavaScript y los mismos identificadores a los divs notificación de error. Crear un botón de envío del formulario y llame a la función de validación de JavaScript con el evento " onSubmit " , que permitirá que el formulario sea procesado si la función devuelve true, pero no va a enviar el formulario si la función devuelve false : <br> <body> <p> <br> <p> complete la siguiente información para aprender más sobre mi Empresa : <br> <p> <form name="contact" onSubmit="return validate()"> <br> <p> Nombre: <input type="text" name="nombre" width="30"> <span id="nameError" class="error"> < /span > <br> p Email : <input type="text" name="email" width="30"> <span id="emailError" class="error"> < /span > <br> < p> <input type="submit" name="submit" value="submit"> <br> <p> < /form> <br> <p> < /body> <br> <p> < /html> <br> 5 <p> Guarde el archivo HTML y abrirlo en un navegador. Prueba de que la forma no se somete si alguno de los campos de entrada de contacto está en blanco . <br> <br>
<div class="escomad2"><script language='javascript' src='http://www.ordenador.online/ad/es/2.js'></script></div>
</div>
<div class=contentpage>
<div class=p1>Página anterior: <a class='LinkPrevArticle' href='http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-cambiar-un-índice-desplegable-en-JavaScript-.html' >Cómo cambiar un índice desplegable en JavaScript </a> </div>
<div class=p2>Página siguiente: <a class='LinkNextArticle' href='http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-calcular-un-total-movimiento-en-JavaScript-.html' >Cómo calcular un total movimiento en JavaScript </a> </div>
</div>
<dl class=xgc>
<dt><span>JavaScript Programación</span></dt>
<dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-crear-un-mapa-de-calor-.html">Cómo crear un mapa de calor </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-comprobar-un-número-entero-de-entrada-en-JavaScript-.html">Cómo comprobar un número entero de entrada en JavaScript </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/JavaScript-Target-iFrame-documento-Tutorial-.html">JavaScript Target iFrame documento Tutorial </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-crear-Google-Maps-aplicación-.html">Cómo crear Google Maps aplicación </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Comunes-estilos-de-fuente-.html">Comunes estilos de fuente </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-visualizar-XML-con-JavaScript-.html">Cómo visualizar XML con JavaScript </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-cambiar-los-colores-de-fuente-con-Javascript-.html">Cómo cambiar los colores de fuente con Javascript </a></dd><dd><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-escribir-Usando-Javascript-.html">Cómo escribir Usando Javascript </a></dd>
</dl>
</div>
<!--right-->
<div class=rightmain>
<div class=esrightlist>
<div class=e1>Los últimos artículos de equipo</div>
<ul>
<li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-cambiar-el-puntero-del-mouse-Usando-Javascript-.html" >Cómo cambiar el puntero del mouse Usando Javascript </a> </li><li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-determinar-si-un-número-se-ajusta-a-un-Int-en-JavaScript-.html" >Cómo determinar si un número se ajusta a un Int en JavaScript </a> </li><li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-desplazarse-a-través-de-mensajes-en-la-barra-de-estado-.html" >Cómo desplazarse a través de mensajes en la barra de estado </a> </li><li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-agregar-una-entrada-Casilla-de-verificación-con-JavaScript-.html" >Cómo agregar una entrada Casilla de verificación con JavaScript </a> </li><li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-prevenir-Copy---Paste-.html" >Cómo prevenir Copy & Paste </a> </li><li><a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-insertar-CrawlTrack-en-WordPress-.html" >Cómo insertar CrawlTrack en WordPress </a> </li>
</ul>
</div>
<div class=esrightlist>
<div class=e1>Artículos de la popular computadora</div>
<ul>
<li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-conseguir-una-página-Web-remoto-con-JavaScript-.html" >Cómo conseguir una página Web remoto con JavaScript </a></li><li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-utilizar-expresiones-regulares-con-JavaScript-.html" >Cómo utilizar expresiones regulares con JavaScript </a></li><li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-Hervir-jamón-en-lata-.html" >Cómo Hervir jamón en lata </a></li><li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-realizar-el-seguimiento-con-la-escritura-de-Java-y-PHP-.html" >Cómo realizar el seguimiento con la escritura de Java y PHP </a></li><li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Cómo-agregar-una-superposición-de-imágenes-con-V3-Maps-API-.html" >Cómo agregar una superposición de imágenes con V3 Maps API </a></li><li> <a href="http://www.ordenador.online/Programacion/JavaScript-Programación/Dreamweaver-Tutorial-de-JavaScript-.html" >Dreamweaver Tutorial de JavaScript </a></li>
</ul>
</div>
<div class="esrightad">
<script language='javascript' src='http://www.ordenador.online/ad/es/r.js'></script>
</div>
<div class=esrightlist>
<div class=e1>Más categorías</div>
<ul>
<li><a href='http://www.ordenador.online/Programacion/C--C-----Programming/' target="_self">C /C + + Programming</a></li>
<li><a href='http://www.ordenador.online/Programacion/Lenguajes-De-Programación/' target="_self">Lenguajes De Programación</a></li>
<li><a href='http://www.ordenador.online/Programacion/Delphi-Programación/' target="_self">Delphi Programación</a></li>
<li><a href='http://www.ordenador.online/Programacion/Programación-Java/' target="_self">Programación Java</a></li>
<li><a href='http://www.ordenador.online/Programacion/JavaScript-Programación/' target="_self">JavaScript Programación</a></li>
<li><a href='http://www.ordenador.online/Programacion/Programación-PHP--MySQL/' target="_self">Programación PHP /MySQL</a></li>
<li><a href='http://www.ordenador.online/Programacion/Perl-Programming/' target="_self">Perl Programming</a></li>
<li><a href='http://www.ordenador.online/Programacion/Python-Programming/' target="_self">Python Programming</a></li>
<li><a href='http://www.ordenador.online/Programacion/Rubí-Programación/' target="_self">Rubí Programación</a></li>
<li><a href='http://www.ordenador.online/Programacion/Visual-Basics-Programación/' target="_self">Visual Basics Programación</a></li>
</ul>
</div>
</div>
<!--right end-->
<div class="cl"></div>
</div>
<div class=esfoot>
<div class=copy>Conocimientos Informáticos © http://www.ordenador.online</div>
</div>
</body>
</html> 