jQuery中radio和select之间的交互

Question

我有以下问题：我有一个选择框，例如3 个值，一个单选按钮组和一个复选框。

我的意图是在选择框中的第三个值被选中或某个（第二个）单选按钮被选中的情况下检查并禁用该复选框。

问题是：每当我选择另一个单选按钮时，复选框被选中但未被禁用，即使选择框是使用第三个值选择的。或者，如果我更改了选择框的值，即使选择了某个单选按钮，复选框也会启用。

我该如何解决这个问题？

提前致谢！！

<select id="sel" >
<option id="opt1" value="0"></option>
<option id="opt1"  value="1" >nope</option>
<option id="opt2"  value="2" >nope</option>
<option id="opt2"  value="3" >this</option>
</select>


<input type="radio" name="11" value="first" id="one"></input>
<input type="radio" name="11" value="second" id="two" ></input>
<input type="checkbox" name="22" value="third" id="third" ></input>


$("input[name='11']").change(function(){
if($("#one").is(":checked")) {
    $("#third").prop("checked",true).prop("disabled","disabled");
} else {   
    $("#third").attr("disabled", false);
}  
});

$("#sel").change(function(){
var m = $("#sel").val();
if (m == "3") {
    $("#third").attr("checked",true).attr("disabled","disabled");
} else {    
    $("#third").attr("disabled", false);}  
});

这里是链接：

http://jsfiddle.net/gcxbgdhc/2/

Answer 1

我建议创建一个单独的函数来检查是否选中和/或禁用复选框，并在单选按钮和选择的更改事件上调用该函数，如下所示：

$("input[name='11']").change(function(){
    setCheckbox();
});

$("#sel").change(function(){
    setCheckbox();
});

var setCheckbox = function() {
    if ($('#sel').val() === '3' || $('#two').is(':checked'))
    {
        $('#third').click().attr('disabled', 'disabled');
    }
    else
    {
        $('#third').removeAttr('checked').removeAttr('disabled');
    }
};

JSFiddle Demo

编辑：

只需添加一个 if 语句。我可能应该指出，如果您需要任何进一步的规范，可能有一些非常简单的 if 语句可以解决问题。

所以在这个例子中，改变

$('#third').click().attr('disabled', 'disabled');

到

if (!$('#third').is(':checked'))
    {
        $('#third').click();
    }
$('#third').attr('disabled', 'disabled');

我已经更新了小提琴。干杯！