Question

我正在尝试将复选框的选中值设置为来自Mongo的传入数据。如果值为true，它可以正常工作，但是当值为false时，它仍会检查该框。任何人都可以告诉我有什么问题。

<input type="checkbox" id="chk" name="interested" value="{{inmate.interested}}" onclick="chkSet(this)">Not Interested <br/>
<input type="checkbox" id="chk" name="correspondence" value="{{inmate.correspondence}}" onclick="chkSet(this)">Req Correspondence<br/>
<input type="checkbox" id="chk" name="study" value="{{inmate.study}}" onclick="chkSet(this)">Request Study<br/>
<input type="checkbox" id="chk" name="specialtyItemsApproved" value="{{inmate.specialtyItemsApproved}}" onclick="chkSet(this)">Specialty Items
Approved<br/>
<br>

$(document).ready(function(){

    document.getElementsByName("interested")[0].checked=document.getElementsByName("interested")[0].value;
    document.getElementsByName("correspondence")[0].checked=document.getElementsByName("correspondence")[0].value;
    document.getElementsByName("study")[0].checked=document.getElementsByName("study")[0].value;
    document.getElementsByName("specialtyItemsApproved")[0].checked=document.getElementsByName("specialtyItemsApproved")[0].value;

});

Answer 1

document.getElementsByName("interested")[0].checked=document.getElementsByName("interested")[0].value;根据元素的值设置checked属性，该元素始终为字符串。所以它会将字符串强制转换为布尔值。所有非空字符串都是 truthy ，因此"true"和"false"都会将checked设置为true。

如果您使用==测试，则可以相应地设置checked：

document.getElementsByName("interested")[0].checked =
    document.getElementsByName("interested")[0].value == "true";

也就是说，HTML / DOM中复选框的值的目的是不以指示是否已选中它，因此将value设置为"true"或{{1首先，可能不是你真正想做的事情。 "false"的目的是说明应该使用格式发送的值，如果选中复选框。例如：

value

如果选中该复选框，则表单将<input type="checkbox" name="roomoptions" value="non-smoking"> <input type="checkbox" name="roomoptions" value="with-kitchen"> <input type="checkbox" name="roomoptions" value="en-suite">，和/或如果选中复选框，则为roomoptions=non-smoking，和/或roomoptions=with-kitchen如果选中复选框。如果未选中任何一个，则表单将不会发送任何roomoptions=en-suite。如果选中所有三个复选框，则会发送所有三个。

另外，您不能在HTML / DOM文档中的多个元素上使用相同的roomoptions。 id必须唯一。因此，您无法在所有复选框上使用id。

所以我怀疑你真的想要更像这样的东西：

id="chk"

然后你根本不需要你的JavaScript。

我没有给那些值，这意味着当表单被发送时（如果您在表单中发送），<input type="checkbox" id="chk-interested" name="interested" {{#if inmate.interested}}checked{{/if}} onclick="chkSet(this)">Not Interested <br/> <input type="checkbox" id="chk-correspondence" name="correspondence" {{#if inmate.correspondence}}checked{{/if}}" onclick="chkSet(this)">Req Correspondence<br/> <input type="checkbox" id="chk-study" name="study" {{#if inmate.study}}checked{{/if}} onclick="chkSet(this)">Request Study<br/> <input type="checkbox" id="chk-specialty-items-approved" name="specialtyItemsApproved" {{#if inmate.specialtyItemsApproved}}checked{{/if}} onclick="chkSet(this)">Specialty Items的值以及服务器将接收的值将是默认值interested。例如，表单将根本没有"on"字段（未选中复选框），或者它将具有interested。

请注意，除非您将这些interested=on用于某些内容，否则您可以将其关闭;它是表单在提交时使用的id。但是我让它们独一无二，以证明你必须这样做。

选中Jquery DOM设置复选框适用于true而非false

1 个答案: