极客教程如何用jQuery找到所有的复选框输入
我们的任务是使用jQuery找到所有的复选框输入。复选框是在激活时被打勾的方块，它被用来选择一个或多个选择。
使用的方法和选择器：
- :checkbox : 这个选择器用于选择type = checkbox的输入元素。
- .wrap()。该方法用于指定每个选定元素周围的HTML元素。
步骤:
- 创建带有输入类型复选框的HTML页面。
- 使用复选框选择器，你可以选择所有带有复选框类型的输入。
- 在
.wrap()方法的帮助下，你可以对那些被选中的项目进行样式设计。
示例:
<!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>
输出:
checkbox