Question

我有以下代码

如果选中了复选框，则应取消选中另一个复选框，然后显示div。如果选中另一个复选框，则应取消选中另一个并显示div。

它单向循环，但不是另一种。我无法弄清楚如何让它在两个方面都有效。

    $('#ssUseDates, #isSearchByDate').click(function() {

    if($('#isSearchByDate').attr('checked')) {
        $('#ssUseDates').removeAttr('checked');
        $('#searchDates').show();
    }
    else if($('#ssUseDates').attr('checked')) {
        $('#isSearchByDate').removeAttr('checked');
        $('#searchDates').show();
    }

如果我检查#ssUseDates框，然后检查#isSearchByDate框，它可以正常工作，取消选中#ssUseDates框然后显示div。如果我检查#isSearchByDate框，那么#ssUseDates框，它不起作用，不会让框检查，也不会取消选中另一个框。

感谢您提出的任何建议。

Answer 1

我认为共享if...else...中的click()是您的问题。尝试拆分： http://jsfiddle.net/TG2ne/6/

$(function() {
    $('#isSearchByDate').click(function() {
        if ($('#isSearchByDate').attr('checked')) {
            $('#ssUseDates').removeAttr('checked');
            $('#searchDates').show();
        } 
    });
    $('#ssUseDates').click(function() {
        if ($('#ssUseDates').attr('checked')) {
            $('#isSearchByDate').removeAttr('checked');
            $('#searchDates').show();
        }
    });
});

或者（并且不太吸引人），您也可以测试点击元素的id： http://jsfiddle.net/TG2ne/11/

$(function() {
    $('#ssUseDates, #isSearchByDate').click(function() {
        if ($(this).attr("id") == "isSearchByDate" && $('#isSearchByDate').attr('checked')) {
            $('#ssUseDates').removeAttr('checked');
            $('#searchDates').show();
        } else if ($(this).attr("id") == "ssUseDates" && $('#ssUseDates').attr('checked')) {
            $('#isSearchByDate').removeAttr('checked');
            $('#searchDates').show();
        }
    })
})

Answer 2

给两个相同的类名并在你想要显示的id上添加一个ref尝试这个：

$('.checkClass').change(function() {
    if($(this).is(':checked')) {
        $('.checkClass').not(this).attr('checked', false).change();
        $('#'+$(this).attr('ref')).show();
    }
    else {
        $('#'+$(this).attr('ref')).hide();
    }
});

这是一个小提琴：http://jsfiddle.net/maniator/9dvDd/5/

jQuery逻辑问题。如果选中其他复选框，则需要取消选中一个复选框，反之亦然

2 个答案: