无法使用jQuery检查变量复选框

Question

我有以下复选框：

<div class="row">
    <div class="large-2 columns"><input  id="contactTypesCheckbox[12]" name="contactTypesCheckbox[12]" class="contactTypesCheckbox" type="checkbox" value="Billing" />&nbsp;Billing</div>
    <div class="large-2 columns"><input  id="contactTypesCheckbox[15]" name="contactTypesCheckbox[15]" class="contactTypesCheckbox" type="checkbox" value="Creative" />&nbsp;Creative</div>
... etc ...
</div>

Onload，我做了一些ajax，然后我拉下了包含一系列项目的json，这些项目指示应该检查哪些复选框。

        $.each(data.contactTypes, function(key, contactType) {
            // key is = 15 in my test
            $('#contactTypesCheckbox[key]').prop('checked', true);
        });

因此我希望检查contactTypesCheckbox [15]，但不是，没有错误。

我做错了什么？

非常感谢

Answer 1

在Javascript中，变量不会在字符串内扩展，需要连接：

$('#contactTypesCheckbox\\['+key+'\\]').prop('checked', true);

您还需要转义括号，因为它们在选择器语法中具有特殊含义。

另见这个问题：

What are valid values for the id attribute in HTML?

关于在ID字符串中使用[]等特殊字符。它在HTML5中允许，但不允许HTML4。由于上述需要逃避，最好不要使用它。