jQuery는 체크박스의 모든 선택과 역선택을 구현합니다.
- 高洛峰원래의
- 2017-02-06 12:58:141274검색
말할 것도 없이 코드를 살펴보세요
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<form>
<label for="apple">苹果</label>
<input type="checkbox" name="apple">
<label for="banana">香蕉</label>
<input type="checkbox" name="banana">
<label for="orange">橘子</label>
<input type="checkbox" name="orange">
<input type="button" value="全选" onclick="allPick()">
<input type="button" value="全不选" onclick="unAllPick()">
<input type="button" value="反转" onclick="inverserPick()">
</form>
<script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
<script>
// 全选
function allPick() {
$("[type=checkbox]:checkbox").each(function () {
this.checked = true;
})
}
// 全不选
function unAllPick() {
$("[type=checkbox]:checkbox").each(function () {
this.checked = false;
})
}
// 反转
function inverserPick() {
$("[type=checkbox]:checkbox").each(function () {
this.checked = !this.checked;
})
}
</script>
</body>
</html>위 내용은 이 글의 전체 내용입니다. 이 글의 내용이 모든 분들의 공부나 업무에 조금이나마 도움이 되었으면 좋겠습니다. 또한 PHP 중국어 웹사이트를 지원하기를 바랍니다!
체크박스의 전체 선택 및 역선택 항목에 대한 jQuery 구현에 대한 자세한 내용은 PHP 중국어 웹사이트에 주목하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.