Una casilla de entrada es un elemento de un formulario HTML que activa una marca de verificación o desactivar cada vez que el usuario hace clic en la caja. Usted puede agregar dinámicamente una casilla de entrada en un formulario HTML, por ejemplo, en función del valor de entrada de otro campo del formulario , utilizando el método JavaScript " createElement " para crear la casilla de verificación y el método " appendChild " para agregarlo a el formulario. Instrucciones
1
Crear un nuevo documento HTML con el Bloc de notas o un editor HTML. Agregar los encabezados HTML al archivo:
< p>
Añadir casilla de verificación < /title > <br> <p> < /head> <br> 2 < p > Crear un formulario HTML en el cuerpo del documento y darle la forma de un nombre por lo que se puede hacer referencia fácilmente usando JavaScript . Agregar un cuadro de lista para el usuario para seleccionar " Sí" o "No" Llamar a una función JavaScript para procesar la entrada cuando cambia la selección utilizando el evento " onChange " : <br> <p> <body> <br> <p> <form name="myForm"> <br> < p > Por favor selecto: <br> <p> <select name = " yesorno " <br> 3 <p> Insertar JavaScript antes del cierre < /head> etiqueta con la etiqueta <script> . Iniciar una variable global para indicar si la casilla de verificación de entrada ya ha sido creado como falsa para asegurarse de que la casilla de verificación de entrada no se crea más de una vez : <br> <p> <script> <br> <p> var hasBox = false; <br> 4 <p> Crear la función que se llama cuando cambia la selección del usuario. Obtener el valor de la selección del usuario con la propiedad " selectedIndex " y el valor de texto de la respuesta con la propiedad "text ": <br> función <p> checkit () { var <br> <p> selección = document.myForm . yesorno.selectedIndex ; <br> <p> var selectionText = document.myForm.yesorno [ selección] texto; . <br> 5 <p> Añada la casilla de entrada de la forma si la selección del usuario es " Sí "y la casilla de verificación no está ya ha sido añadida a la forma . Utilice el método " createElement " para crear un nuevo elemento . Reemplazar " innerHTML " del elemento con el código de entrada para la casilla de verificación . Utilice el método " appendChild " y el nombre del formulario para agregar el nuevo elemento al formulario. Ajuste el indicador global de " cierto" que el cuadro se ha añadido : <br> <p> if (! SelectionText == "Sí" && hasBox ) { var <br> cuadro <p> = document.createElement ( " div " ) ; <br> <p> box.innerHTML = ' <input type="checkbox" name="checkme"> Marque aquí para confirmar ' ; <br> <p> document.myForm.appendChild (caja) ; <br> <p> hasBox = true; } <br> <p> <br> <p> < /script > <br> <br>
<div class=ad2><script language='javascript' src='/ad/201310/4.js'></script></div>
</div>
</td>
</tr>
</table>
<table width="95%" height="1" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#DEE7EE">
<tr>
<td></td>
</tr>
</table>
<table width="100%" height="7" border="0" cellpadding="0" cellspacing="0">
<tr>
<td></td>
</tr>
</table>
<table width="91%" height="52" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="51%"><p>Previous ： <a class='LinkPrevArticle' href='/Programacion/javascript-programming/90928.html' >Cómo agregar un hipervínculo a un título de LightBox </a></li></p></td>
</tr>
<tr>
<td width="49%"> next ： <a class='LinkNextArticle' href='/Programacion/javascript-programming/90930.html' >Cómo comprobar Listas de comprobación para Joomla </a></li></td>
</tr>
</table></td>
</tr>
</table>
<table width="100%" height="7" border="0" cellpadding="0" cellspacing="0">
<tr>
<td></td>
</tr>
</table>
<table width="770" height="246" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="375" height="246" valign="top"><table width="380" border="0" cellpadding="0" cellspacing="0" class="bian">
<tr>
<td height="244" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" background="img_dm/danmai_r4_c04 -.jpg" bgcolor="#DBE3EE">
<tr>
<td width="4%" height="29"> </td>
<td width="96%" class="lan_lm"> Artículos relacionados </td> </tr>
</table>
<table width="95%" height="209" border="0" align="center" cellpadding="0" cellspacing="4">
<tr>
<td height="201"><table width="100%" cellpadding="0" cellspacing="0"><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/91183.html" title="Cómo cambiar la entrada de texto con javascript " target="_self">Cómo cambiar la entrada de texto con javascript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/91286.html" title="Cómo hacer un Widget para el Dashboard con Dashcode " target="_self">Cómo hacer un Widget para el Dashboard con Dashcode </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/90906.html" title="JavaScript para cálculos de tiempo " target="_self">JavaScript para cálculos de tiempo </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/91040.html" title="Cómo crear texto HTML Desde Javascript Variable " target="_self">Cómo crear texto HTML Desde Javascript Variable </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/91179.html" title="Causas de una secuencia de comandos Void Error Java " target="_self">Causas de una secuencia de comandos Void Error Java </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/90823.html" title="Cómo agregar números múltiples utilizando JavaScript " target="_self">Cómo agregar números múltiples utilizando JavaScript…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/91082.html" title="Cómo recuperar los datos de una base de datos mediante Java Script " target="_self">Cómo recuperar los datos de una base de datos mediante…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/90982.html" title="Cómo cambiar de menú Imágenes en mouseover en JavaScript " target="_self">Cómo cambiar de menú Imágenes en mouseover en JavaSc…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/90970.html" title="Cómo habilitar y deshabilitar barras de desplazamiento con javascript " target="_self">Cómo habilitar y deshabilitar barras de desplazamiento…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/91217.html" title="¿Qué es JavaScript Void " target="_self">¿Qué es JavaScript Void </a></td></tr><tr></tr></table></td>
</tr>
</table></td>
</tr>
</table></td>
<td width="20" valign="top"></td>
<td width="375" valign="top"><table width="380" border="0" cellpadding="0" cellspacing="0" class="bian">
<tr>
<td height="244" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" background="img_dm/danmai_r4_c04 -.jpg" bgcolor="#DBE3EE">
<tr>
<td width="4%" height="29"> </td>
<td width="96%" class="lan_lm">Artículos destacados </td> </tr>
</table>
<table width="95%" height="207" border="0" align="center" cellpadding="0" cellspacing="4">
<tr>
<td height="199"><table width="100%" cellpadding="0" cellspacing="0"><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/java-programming/89407.html" title="¿Qué es PrintStream en Java " target="_self">¿Qué es PrintStream en Java </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/java-programming/90616.html" title="Cómo instalar Java para juegos " target="_self">Cómo instalar Java para juegos </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/java-programming/89288.html" title="Cómo Involucrar API con Android " target="_self">Cómo Involucrar API con Android </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/javascript-programming/91154.html" title="Cómo dibujar un gráfico circular Usando Javascript " target="_self">Cómo dibujar un gráfico circular Usando Javascript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/computer-programming-languages/87198.html" title="Cómo configurar una variante en SAP " target="_self">Cómo configurar una variante en SAP </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/visual-basics-programming/94513.html" title="Cómo utilizar VB6 hacer Booters " target="_self">Cómo utilizar VB6 hacer Booters </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/cc-programming/85981.html" title="¿Qué es la mezcla alfa " target="_self">¿Qué es la mezcla alfa </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/php-mysql-programming/93141.html" title="Cómo probar con PHP " target="_self">Cómo probar con PHP </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/computer-programming-languages/86415.html" title="Cómo utilizar las Ideas y Descripción con ColdFusion " target="_self">Cómo utilizar las Ideas y Descripción con ColdFusion </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programacion/java-programming/89261.html" title="Cómo utilizar Java para hacer rollover botones " target="_self">Cómo utilizar Java para hacer rollover botones </a></td></tr><tr></tr></table></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table>
<table width="980" height="8" border="0" cellpadding="0" cellspacing="0">
<tr>
<td></td>
</tr>
</table>
<table border=0 cellSpacing=0 cellPadding=0 width=980 bgColor=#36506e height=90>
<tr>
<td class=bs height=90 align=middle>Copyright © Conocimientos Informáticos http://ordenador.wingwit.com
<script language='javascript' src='/ad/201310/1.js'></script></td>
</tr>
</table>
</div>
</body>
</html>
