jquery中的toggle disabled属性

时间:2012-08-10 14:02:04

标签: jquery

我有一个启用或禁用选择元素的复选框

实际上我使用这段简单的代码就可以了。

$("#filtri").change(function(){
    if ($("#menuContinenti").attr("disabled")) {
        $("#menuContinenti").removeAttr("disabled");
    } else {
        $("#menuContinenti").attr("disabled", "disabled");
    }
});

这是最好的方法,还是有.toggle()功能可以在禁用/启用之间切换?

3 个答案:

答案 0 :(得分:40)

您应该将.prop用于禁用:

$("#menuContinenti").prop('disabled', function () {
   return ! $(this).prop('disabled');
});

UPDATE:没有意识到当前属性值是函数的参数;这个版本更干净:

$("#menuContinenti").prop('disabled', function (_, val) { return ! val; });

更新:ES2015

$("#menuContinenti").prop("disabled", (_, val) => !val);

答案 1 :(得分:7)

你可以编写自己喜欢的插件。

在jQuery之后,最好在脚本文件中添加。

(function($) {
    $.fn.toggleDisabled = function(){
        return this.each(function(){
            this.disabled = !this.disabled;
        });
    };
})(jQuery);

然后像这样使用它:

$('#my-select').toggleDisabled();

礼貌:Toggle input disabled attribute using jQuery

答案 2 :(得分:1)

您可以使用$ .is函数进行检查,如下所示

$("#filtri").change(function(){
    $("#menuContinenti").attr("disabled", ! $(this).is(':checked'));    
});