启用多个文本框和单个复选框

Enable multiple textbox with single checkbox

本文关键字:单个 复选框 文本 启用      更新时间:2023-09-26

我正在创建一个复选框来启用多个文本框。如果选中,则默认为启用或禁用。

Javascript代码:
$(document).ready(function(){
    $('#sccb').click(function(){
        if (this.checked) {
            $('#cns').removeAttr("disabled");
            $('#cns2').removeAttr("disabled");
            $('#cns3').removeAttr("disabled");
        } else {
            $("#cns").attr("disabled", true);
            $("#cns2").attr("disabled", true);
            $("#cns3").attr("disabled", true);
        }
    });
});
HTML代码:
<input type="checkbox" id="sccb" name="science" value="science">
<input type="text" id="cns" name="coornamescience" disabled="disabled" size="30" />
<input type="text" id="cns2" name="coornamescience" disabled="disabled" size="30" />
<input type="text" id="cns3" name="coornamescience" disabled="disabled" size="30" />

它可以在jsfiddle上工作,但它不能在。html文件中工作,请帮助。

你忘记添加jquery了吗?

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('#sccb').click(function(){
        if (this.checked) {
            $('#cns').removeAttr("disabled");
            $('#cns2').removeAttr("disabled");
            $('#cns3').removeAttr("disabled");
        } else {
            $("#cns").attr("disabled", true);
            $("#cns2").attr("disabled", true);
            $("#cns3").attr("disabled", true);
        }
    });
});
</script>
</head>
<body>
    <form ...>
         Your form here
    </form>
</body>
</html>