La tarea es encontrar toda la entrada de la casilla de verificación usando jQuery. Las casillas de verificación son las casillas cuadradas que se marcan cuando se activan y se utilizan para seleccionar una o más opciones.
Método y Selectores utilizados:
- :checkbox : Este selector se usa para seleccionar el elemento de entrada con type = checkbox .
- .wrap() : este método se usa para especificar el elemento HTML alrededor de cada elemento seleccionado.
Acercarse:
- Cree la página HTML con la casilla de verificación de tipo de entrada .
- Usando el selector de casilla de verificación, puede seleccionar todas las entradas con la casilla de verificación de tipo.
- Con la ayuda del método .wrap() , puede diseñar los elementos seleccionados.
Ejemplo:
HTML
<!DOCTYPE html>
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js">
</script>
<style>
body {
text-align: center;
font-size: 30px;
}
button {
background-color: #4caf50; /* Green */
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
}
</style>
<script>
$(document).ready(function () {
$(":checkbox").wrap("<span style='border-style:dotted'>");
});
</script>
</head>
<body>
<h2 style="color: green">GeeksforGeeks</h2>
<form action="">
First Name: <input type="text" name="user" />
<br />
<br />I like chocolates
<input type="checkbox" name="chocolate"
value="chocolate" /><br />
I like fruits:
<input type="checkbox"
name="fruits" value="fruits" />
<br />
I like blue color:
<input type="checkbox"
name="color" value="color" />
<br />
<button>Submit</button>
</form>
</body>
</html>
Producción:
caja
Publicación traducida automáticamente
Artículo escrito por krishna_97 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA