chuyển đổi thuộc tính bị vô hiệu hóa trong jquery

Question

Tôi đã chọn hộp kiểm bật hoặc tắt một phần tử chọn

Thực ra tôi sử dụng đoạn mã đơn giản này hoạt động tốt.

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

Đây có phải là cách tốt nhất hoặc có chức năng .toggle() để chuyển đổi giữa tắt/bật không?

Answer 1

Bạn nên sử dụng .prop cho người khuyết tật:

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

UPDATE: đã không nhận ra giá trị tài sản hiện nay là một cuộc tranh cãi với chức năng; phiên bản này thậm chí còn sạch hơn:

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

UPDATE: ES2015

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

Answer 2

Bạn có thể viết plugin của riêng bạn mà làm điều gì đó như thế này.

Thêm phần này sau jQuery, trong tệp tập lệnh tốt nhất.

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

Sau đó sử dụng nó như thế này:

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

Courtesy: Toggle input disabled attribute using jQuery

Answer 3

bạn có thể kiểm tra sử dụng $ .là chức năng như dưới đây

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