Question

我已经在进行change事件/侦听器，但是当有人刷新页面...等（页面加载）并且已经选中复选框时，此操作不起作用。

如何检查页面加载时是否选中了任何复选框，并获取其名称/值（无论如何）？

示例：我检查是否检查了特定DOM元素中的ANY复选框，如下所示：

if($("#allocation input:checkbox").is(':checked')){
    console.log("something is checked");
}

但是我如何才能真正获得页面加载时检查的id？

上面的内容像$this.id一样吗？（但这当然行不通）。

或者您可以将event.target与上述is.('checked')有条件地绑定吗？

同样，我已经为.change()（用户交互）部分准备了一些内容，但是如果选中了一个复选框并且有人重新加载了页面，那么该复选框仍然处于选中状态（而我仍要满足这一要求）。

我在这里的最终解决方案：（与以下建议类似/相同）

KEY ..使用“每个”功能。

//on page load
                    $('#allocation input:checked').each(function() {
                        if($(this).is(':checked')){
                            //console.log("CB CHECK: " + $(this).attr('id'));
                            var targetID = $(this).attr('id');
                            $('#' + targetID + 'amount').prop('disabled', false);
                        }
                    });

Answer 1

这将遍历所有选中的复选框，并console.log记录其ID。

ID可通过PROP访问。

$("input:checkbox:checked").each(function(){
    console.log($(this).prop("id"));
});

编辑：也获取它们的名称和值

$("input:checkbox:checked").each(function(){
    console.log($(this).prop("id"),$(this).prop("name"),$(this).val());
});

Answer 2

合并选择器"#allocation input:checked"（或"#allocation input:checkbox:checked"），这将为您提供所有选中的复选框的数组。然后使用each()遍历它们，然后使用id获得this.id。

将整个代码放入代码底部的自执行功能(function() {...})();中，或至少单击所有复选框。像这样：

(function() {
  $("#allocation input:checked").each(function() {
    console.log(this.id + " is checked")
  });
})();

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<div id="allocation">
  <input type="checkbox" id="chk1" checked="checked" /> Option 1
  <input type="checkbox" id="chk2" /> Option 2
  <input type="checkbox" id="chk3" /> Option 3
  <input type="checkbox" id="chk4" checked="checked" /> Option 4
  <input type="checkbox" id="chk5" checked="checked" /> Option 5
</div>

如何判断页面加载时选中了哪些复选框？

2 个答案: