禁用alt-checkbox

时间:2014-05-13 08:12:18

标签: javascript jquery html

我正在使用alt-checkbox jquery插件来显示复选框。我无法禁用alt-checkbox。对于禁用chekbox我使用了以下属性。

$("#MyId").prop("disabled",true);

http://alt-checkbox.starikovs.com/ - 此参考网址为alt-checkbox。

3 个答案:

答案 0 :(得分:0)

你可能想试试这个: http://jsfiddle.net/lotusgodkk/GCu2D/107/

我使用了alt-checkbox

演示中提供的示例代码

使用Javascript:

var make = (function () {//Sample code from demo starts.
jQuery("#checkbox1").altCheckbox({
    outlineUnchecked: false,
    sizeClass: "small"
});
jQuery("#checkbox2").altCheckbox();
jQuery("#checkbox3").altCheckbox({
    sizeClass: "big"
});
});
make();//Sample code from demo ends

//Actual code begins
$(document).on('click', '.alt-checkbox', function (e) {
    var a = $(this);
    var cb = a.nextAll('input[type="checkbox"]:first');
    if (cb.attr('disabled')) {
        console.log('doing nothing');
        e.stopPropagation();
        a.removeClass('checked');
        return false;
    } else {
        return true;
    }
});

HTML:

<h1>alt-checkbox demo</h1>
<input type="checkbox" id="checkbox1">
<label for="checkbox1">Check Me! I'm small.</label>
<input type="checkbox" id="checkbox2" disabled="disabled">
<label for="checkbox2">Check Me! I'm medium.</label>
<input type="checkbox" id="checkbox3">
<label for="checkbox3">Check Me! I'm big.</label>
<div> 
   <a href="javascript:make()">make</a>
   <a href="javascript:jQuery('[type=checkbox]').altCheckbox('clear')">clear</a>
</div>

注意:您可以忽略make()功能。 在第二个复选框中,我添加了disabled属性以用于测试目的。只要您想禁用输入,就可以添加disabled属性。

答案 1 :(得分:0)

这是一个简单的解决方法。您必须“清除”altCheckbox,更改属性,然后再将它们“制作”为altCheckbox。

<script type="text/javascript">
  function disableMe()
	jQuery('[type=checkbox]').altCheckbox('clear')
	document.getElementById('MyId').checked=false;
	document.getElementById('MyId').disabled=true;
    jQuery("#MyId").altCheckbox({outlineUnchecked:false,sizeClass: "small"});
</script>
<h1>alt-checkbox demo</h1>
<input type="checkbox" id="MyId">
<label for="checkbox1">Check Me! I'm small.</label>
<br><br>
<button onclick="disableMe()">disableMe</button>

答案 2 :(得分:0)

我们使用相同的组件,在这些情况下,我们&#34;禁用&#34;生成的锚元素的click事件如下:

$(':checkbox:disabled').prev(".alt-checkbox").off("click");