使用FacetWP限制复选框可勾选数量的代码问题如何解决？

现有代码存在的问题 #

• 运算符使用错误：if条件中使用赋值运算符=替代了全等比较运算符===，代码FWP.facets['hosting_provider_naam'].length = 2会直接强制将选中数量设置为2，且该表达式永远返回真值，导致所有点击操作都会被阻止，因此无法勾选任何复选框。
• 事件对象未声明：回调函数没有接收event参数，部分浏览器环境下直接调用event会触发未定义错误。
• 事件绑定方式不兼容FacetWP特性：直接给.facetwp-checkbox绑定click事件，当FacetWP筛选后动态重渲染页面DOM时，之前绑定的事件会完全失效。
• 逻辑判断不完整：未区分用户当前点击的是「未选中要勾选」还是「已选中要取消」的复选框，即使用户是要取消已选的选项也会被错误阻止。

修正后的完整代码 #

<?php
add_action( 'wp_head', function() {
?>
    <script>
        (function($) {
            // 事件委托绑定，兼容FacetWP动态渲染的DOM
            $(document).on('click', '.facetwp-checkbox', function (event) {
                const maxSelect = 2; // 最大可勾选数量，可按需调整
                const currentSelected = FWP.facets['hosting_provider_naam'].length;
                // 仅当已选满且当前点击的是未选中的复选框时阻止操作
                if (currentSelected === maxSelect && !$(this).hasClass('checked')) {
                    event.stopImmediatePropagation();
                    // 可选：放开下方注释给用户明确的上限提示
                    // alert('最多只能选择2个服务商');
                }
            });
        })(jQuery);
    </script>
<?php });

内容的提问来源于stack exchange，提问作者user2812779