jquery - 使用 jquery 在通过选中复选框选择的两个选项之间切换

Question

在我的应用程序中，我有一个 View ，在某些情况下，我会为用户提供个人输入一些基本信息的能力。然而，这是动态完成的，所以我在我的 .js 文件中有函数，如果满足条件，我会这样做:

$("#clientdata-container").append('<label>Private Client</label>...);

这个问题的相关部分你可以在这个 JS Fiddle 中看到.

我想做什么。我希望能够在复选框提供的这两个选项之间切换(切换)，但绝不允许同时选择它们。换句话说，如果您看到了 fiddle 示例，如果选中了 Private Client 复选框，然后用户直接选中 Company User 复选框，我想自动隐藏与 html 相关的内容给 Private user，取消选中复选框，并为 Company user 显示 html。我一直在使用大量的 if 检查来做这件事，但我觉得 toggle() 函数就是这样的情况，但我在实现它时遇到了问题所以我需要使用切换帮助完成这项工作。当然，如果可能的话。

Answer 1

试试这个:您可以使用 .not() 取消选中不包括已单击的复选框，并将 clientdata-container 清空，如果复选框被选中则填充它，否则保留它.

function showHideIndividualAttributes(sender) {
    $('input[type="checkbox"]').not(sender).prop('checked',false);
    $('#clientdata-container').empty();
    if (sender.checked) {
        $('#clientdata-container').append('<span>Private Client attributes</span>');
    } 
}

function showHideCompanyAttributes(sender) {
   $('input[type="checkbox"]').not(sender).prop('checked',false);
    $('#clientdata-container').empty();
    if (sender.checked) {
        $('#clientdata-container').append('<span>Company Client attributes</span>');
    } 
}

DEMO