javascript - 使用 jQuery 检查页面加载时检查的输入数量

Question

我有这个JS，当选择一定数量的项目时将禁用其他选项，而在选择这些项目时将更新计数，但是效果很好!当我将这些添加到购物车时，我可以在购物车中进行编辑，因此当我单击“编辑”时，它会返回到产品页面，并且我选择了客户在添加到购物车时选择的选项但我的计数显示 3 中的 0，并且其他选项未禁用。

我知道我需要在页面加载时执行each/foreach来检查是否选中了任何复选框，如果是，则在限制条件下禁用其他复选框等，但这花了我一段时间。我需要一些帮助才能将其到达此 fiddle 中的位置。我如何在加载时检查这些？

原始 fiddle :

https://jsfiddle.net/ate9a04u/2/

JS:

$(document).ready(function() {
  var maxAllowed = 3;
  $(".rmax").html(maxAllowed);

  $(".subscribtion-content input.checkbox").change(function() {
    var checkBox = $(".subscribtion-content input.checkbox")
    var cnt = $(".subscribtion-content input.checkbox:checked").length;
    if (cnt == maxAllowed) {
      checkBox.not(':checked').prop('disabled', true);
    } else {
      checkBox.not(':checked').prop('disabled', false);
    }

    $(".rcount").html(cnt);
  });
});

Answer 1

我认为您是说您希望与 .change() 处理程序执行相同的处理，不仅在单击复选框时运行，而且在页面加载时运行.

如果是这样，只需在将 .change() 处理程序绑定(bind)到现有的就绪处理程序后立即手动触发一次即可:

$(document).ready(function() {
  var maxAllowed = 3;
  $(".rmax").html(maxAllowed);

  $(".subscribtion-content input.checkbox").change(function() {
    var checkBox = $(".subscribtion-content input.checkbox")
    var cnt = $(".subscribtion-content input.checkbox:checked").length;
    if (cnt == maxAllowed) {
      checkBox.not(':checked').prop('disabled', true);
    } else {
      checkBox.not(':checked').prop('disabled', false);
    }

    $(".rcount").html(cnt);
  }).change();  // <--- this is all you need to add
});

演示:https://jsfiddle.net/ate9a04u/6/