將禁用的屬性設置爲true或false switchery

Question

我使用這個漂亮的iOS複選框插件Switchery iOS checkbox。默認情況下，該複選框處於禁用狀態。現在，如果用戶單擊具有「btn_modify」類的按鈕，並且在用戶單擊具有「btn_cancel」類的按鈕時將其禁用，則需要啓用切換盒複選框。以下是我的代碼參考。

<input type="checkbox" name="" value="" class="js-switch" checked /> 
<button class="btn_modify">Modify</button> 
<button class="btn_cancel">Cancel</button> 

並激活switchery

//switchery 
var elems = Array.prototype.slice.call(document.querySelectorAll('.js-switch')); 
elems.forEach(function(html) { 
    var switchery = new Switchery(html, { size: 'small', disabled: true, disabledOpacity: 1.0 }); 
}); 

和我嘗試

$(".btn_modify").click(function(){ 
    $(".js-switch").attr("disabled", false); 
}); 

$(".btn_cancel").click(function(){ 
    $(".js-switch").attr("disabled", true); 
}); 

但遺憾的是沒有工作，任何幫助，想法，線索，意見，建議，將不勝感激。謝謝！

Answer 1

var elem = document.querySelector('.js-dynamic-state'); 
var switchery = new Switchery(elem); 

document.querySelector('.js-dynamic-disable').addEventListener('click', function() { 
    switchery.disable(); 
}); 

document.querySelector('.js-dynamic-enable').addEventListener('click', function() { 
    switchery.enable(); 
}); 

你的情況，這將是

var elem = document.querySelector('.js-switch'); 
var switchery = new Switchery(elem); 

document.querySelector('.btn_cancel').addEventListener('click', function() { 
    switchery.disable(); 
}); 

document.querySelector('.btn_modify').addEventListener('click', function() { 
    switchery.enable(); 
}); 

第二個選項

CSS

.disabled{ 
opacity: 0.5; 
pointer-events: none;  
} 

個

JS

$(".btn_modify").on("click",function(){ 
     $(".switchery").removeClass("disabled"); 
    }); 

$(".btn_cancel").on("click",function(){ 
    $(".switchery").addClass("disabled"); 
}); 

Jsfiddle Demo

參考http://abpetkov.github.io/switchery/

Answer 2

disabled = false仍將註冊爲禁用。以啓用此功能的唯一方法是完全移除已停用的屬性，是這樣的：

$(".js-switch").removeAttr('disabled');