Question

我有一个“歌曲请求”表单，它会计算从每个类型中选择的每个复选框。该值将添加到固定在网站底部的“#SONGS PICKED”元素中。它完美无缺，直到我添加Ninja Forms Conditional Logic：http://911dj.smallmind.co/song-requests/

当您从“从以下类型中选择歌曲：”选择字段中选择一种类型时，会出现相应的核对清单，并从HTML中删除前一个（如果选择了一个）。

当您从当前/新复选框列表中选中一个复选框时，这会使计数器从1开始。如果您切换回上一个类型，它会重新选择该列表最多的位置。

以下是我的jQuery：

jQuery(document).ready(function() {
    function updateCounter() {
        var len = $("input[type='checkbox']:checked").length;
        if (len > 0) {
            $(".counter").text('' + len + '');
        } else {
            $(".counter").text('0');
        }
    if (len == 1) {
            $(".multi").text('');
        } else {
            $(".multi").text('s');
        }
    }
    jQuery(document).on("change","input[type='checkbox']", function() {
        updateCounter();
    });
});

我真的无法弄清楚如何锁定价值。任何帮助将不胜感激，因为这个网站已完成99.99％，需要这个固定才能启动。提前谢谢！

Answer 1

请尝试使用此代码可能会对您有所帮助

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<input type="checkbox" name="song" value="song1">song1<br>
<input type="checkbox" name="song" value="song2">song2<br>
<input type="checkbox" name="song" value="song3">song1<br>
<input type="checkbox" name="song" value="song4">song2<br>
<p class="counter">0</p>
    <script type="text/javascript">
    jQuery(document).ready(function() {
    function updateCounter() {
        var len = $("input[type='checkbox']:checked").length;
        if (len > 0) {
            $(".counter").text('' + len + '');
        } else {
            $(".counter").text('0');
        }
    if (len == 1) {
            $(".multi").text('');
        } else {
            $(".multi").text('s');
        }
    }
    jQuery(document).on("change","input[type='checkbox']", function() {
        updateCounter();
    });
});    
</script>

复选框计数器重置为条件逻辑插件的结果

1 个答案: