Jquery在div中显示复选框的值

Question

我有这个脚本，它允许我显示复选框（aspx）旁边的值（文本）。在复选框上，更改文本显示在以逗号分隔的div中。不知何故，如果选中任何复选框然后进行二次检查，则该值不会从JobIDs var中消失。我在这里失踪了什么？

 $(document).data('JobNumbers', "");
 $('[id*=projectchk] input').change(function() {
    var JobIDs = "";
    var JobIDs = $(':checked').map(function() {
        return $(this).closest("span").find("label").html();
    }).get().join(', ');
    var JobNumbers = "<label> Reference Job #:</label> " + JobIDs;
    $('#job_numbers').html(JobNumbers);
    if (JobIDs != "") {
        $(document).data('JobNumbers', JobNumbers);
    }
    return false;
 });

因此，如果选中3个复选框，则会显示：

但即使我选择了所有这些，它仍会显示最后一个：

感谢。

Answer 1

当您选择所有这些语句时，该语句将变为false：

if (JobIDs != "") {
    $(document).data('JobNumbers', JobNumbers);
}

所以你的代码没有被执行。

编辑：如果您不想在没有选择选项的情况下显示标签，我认为这样可行：

 $(document).data('JobNumbers', "");
 $('[id*=projectchk] input').change(function() {
    var JobIDs = "";
    JobIDs = $(':checked').map(function() {
        return $(this).closest("span").find("label").html();
    }).get().join(', ');
    var JobNumbers = "";
    if (JobIDs != "") {
        JobNumbers = "<label> Reference Job #:</label> " + JobIDs;
    }
    $('#job_numbers').html(JobNumbers);
    $(document).data('JobNumbers', JobNumbers);
    return false;
 });

这里也是一个很好的做法提示：每次使用变量时都不需要写var，只有当你声明它时。我还强烈建议您阅读有关JavaScript let和const =）

的内容