checkbox复选框,让其勾选时触发一个事件，取消勾选时不触发

最新推荐文章于 2025-05-28 11:39:43 发布

你狗

最新推荐文章于 2025-05-28 11:39:43 发布

阅读量6.9k

点赞数

CC 4.0 BY-SA版权

文章标签： java javascript c# ViewUI

原文链接：http://www.cnblogs.com/jiangaihu/p/10932600.html

这篇博客介绍了如何使用jQuery实现当checkbox被勾选时触发一个事件，而在取消勾选时不触发事件的功能，主要针对JavaScript和jQuery的交互进行探讨。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

jQuery对CheckBox复选框操作

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script src="js/jquery-2.1.0.js" type="text/javascript"></script>
<script type="text/javascript">
function chk() {
    //当选中input为4时，其他选项清除选中并锁定，取消4选定，锁定解除 
    if ($("#fr").prop("checked")==true) {
        $("input[type='checkbox']").prop("checked",false);
        $("input[type='checkbox']").prop("disabled",true);
        $("#fr").prop("checked",true);
        $("#fr").prop("disabled",false);
    }else{
        $("input[type='checkbox']").prop("disabled",false);
    }
}
</script>
</head>
<body>
<input type="checkbox" name="text" value="00"/>0
<input type="checkbox" name="text" value="01"/>1
<input type="checkbox" name="text" value="02"/>2
<input type="checkbox" name="text" value="03"/>3
<input type="checkbox" name="text" value="04" id="fr" onclick="chk()"/>4
</body>
</html>