jQuery 选中/取消选中事件

Posted 2023-03-05

【中文标题】jQuery 选中/取消选中事件

【英文标题】：jQuery check/uncheck event

【发布时间】：2013-07-31 08:45:36

【问题描述】：

我有一些正常工作的代码，当检查复选框时，它会禁用三个字段并为这些字段设置值。

$(document).ready(function () 
    $("#checkbox_1").change(function ()  
        $("#textbox_1").attr("disabled", $(this).attr("checked"));
        $("#textbox_2").attr("disabled", $(this).attr("checked"));
        $("#textbox_3").attr("disabled", $(this).attr("checked"));
        $("#textbox_1").val(1);
        $("#textbox_2").val("Classic");
        $("#textbox_3").val(1);
    );
);

我的问题是，我该如何做才能在未选中该框时将这三个字段的值设置回来？

【参考方案1】：

使用元素属性而不是属性来设置元素的当前状态：

$(document).ready(function () 
   $("#checkbox_1").change(function ()  
      $("#textbox_1").prop("disabled", $(this).prop("checked"));
      $("#textbox_2").prop("disabled", $(this).prop("checked"));
      $("#textbox_3").prop("disabled", $(this).prop("checked"));
      $("#textbox_1").val(1);
      $("#textbox_2").val("Classic");
      $("#textbox_3").val(1);
   );
);

【讨论】：

这应该与 toggle() 一起使用...我也喜欢使用 .prop("checked", true);或 .prop("checked", false);更明确...