jquery - JQuery 和复选框

Question

我遇到了 Jquery 和 Checkboxes 的问题。例如，我有这个：

<input type="checkbox" name="guest" value="1" />
<input type="checkbox" name="guest" value="2" />
<input type="checkbox" name="guest" value="3" />

<input type="text" id="player-1" />
<input type="text" id="player-2" />
<input type="text" id="player-3" />

我的问题以及我一直在寻找的问题是如何使用 JQuery 禁用 input[type=text]。

这是我的代码：

<script>
$("input").on("click", function() {
var i = $("input:checked").val();
if(this.checked)
$("#player-"+i).attr("disabled", "disabled");
else
$("#player-"+i).removeAttr("disabled");
});
</script>

可能有什么问题我没有得到，但是当我单击一个复选框时，它会禁用第一个文本，如果我取消选中它，在我选中另一个文本之前什么都不会发生。

谢谢你的时间！！！

Answer 1

你需要

 var i = $(this).val();

代替

var i = $("input:checked").val();

现场演示

$("input").on("click", function () {
    var i = $(this).val();
    if (this.checked) $("#player-" + i).attr("disabled", "disabled");
    else $("#player-" + i).removeAttr("disabled");
});

Answer 2

您可以使用jQueryprop方法启用/禁用输入：

$("input").prop('disabled', true);
$("input").prop('disabled', false);

对于您的示例：

$("#player-" + i).prop('disabled', this.checked);

Answer 3

问题$("input:checked").val()出在这一行。

将其更改为，

$("input").on("click", function () {
    var i = $(this).val();
    if (this.checked) 
        $("#player-" + i).attr("disabled", "disabled");
    else 
        $("#player-" + i).removeAttr("disabled");
});

因为它只有在被检查时才有价值。当您取消选中该复选框时，它将显示undefined。