javascript - jQuery，如何在页面加载时禁用或启用带有复选框的 <select> 元素？

Question

我有一个简单的功能，可以在选中/取消选中复选框时禁用/启用选择元素。它运作良好。然而，一旦表单被提交并且复选框加载已经被选中(在 PHP 的帮助下)，选择不会被禁用，直到我点击复选框两次。

<select id="worldSelect" class="select" name="world">
<input id="worldcb" type="checkbox" checked="yes" value="any" name="world">
any world 

function toggleSelection(element){
    if (this.checked) {
        $(element.data).attr('disabled', 'disabled');
    } else {
        $(element.data).removeAttr('disabled');
    }
}

$(function() {
    $('#worldcb').click('#worldSelect', toggleSelection);
});

我已经尝试了几件事，但是到目前为止我对 jQuery 还不是很擅长...

Answer 1

看来您快到了。只有几个语法错误。

$("#worldcb").click(function(){
    var el = $("#worldSelect");
    if (el){
        el.removeAttr("disabled");
        if (this.checked){
            el.attr("disabled", "disabled");     
        }
    }
});        

这是一个 jsFiddle进行演示。

至于在回发页面时保持禁用状态，您只需要在页面加载时运行一些逻辑即可。

if ($("#worldcb").is(":checked")){
    $("#worldSelect").attr("disabled", "disabled");
}