jQuery ->取消选中一个框

Question

我有一个可以穿多个防弹衣的士兵。您可以轻松选择它们，但是如果单击选定的盒子，则必须取消设备并取消选中框。有人对我有一个想法如何解决吗？小提琴的例子很可爱。

我的小提琴：http：//jsfiddle.net/4r3ts/

$('#vest1').click(function () {
    $('.block1').show();
    $('.block2').hide();
    $('.vest').addClass('hide');
    $('.vest1').removeClass('hide');
    $('.vest1').css({
        position: 'relative',
        top: '-105px',
        left: '12px',
    });
    $('#right1').fadeIn();
    $('#right2').fadeOut();
});

$('#vest2').click(function () {
    $('.block1, .block2').show();
    $('.vest').addClass('hide');
    $('.vest2').removeClass('hide');
    $('.vest2').css({
        position: 'relative',
        top: '-210px',
        left: '12px',
    });
    $('#right1').fadeOut();
    $('#right2').fadeIn();
});

Answer 1

用 id="box"取消选中框：

$('#box').prop('checked', false);

Answer 2

hidei建议将图像定位在CSS中。我不明白为什么您每次都应该用jQuery定位它们。你可以做一次。

我在代码中找不到＃right1和＃right2。这可能是旧的代码，还是仍在使用的？它也不在小提琴中。

单击按钮时，我看不到任何需要检查的东西。如果要添加它，则可以通过将代码添加到功能ShowVest（）和hidevest（）。

来轻松执行此操作。

(function(){
    var selectedVest;
    $('#vest1').click(function () {
        if(selectedVest === 'vest1') {
            selectedVest = '';
            selectedVest();
        } else {
            selectedVest = 'vest1';
            showVest ('vest1');
        }
    });

    $('#vest2').click(function () {
        if(selectedVest === 'vest2') {
            selectedVest = '';
            hideVest ('vest2');
        } else {
            selectedVest = 'vest2';
            showVest ('vest2');
        }
    });
    var showVest = function ( vest ) {
        if (vest === 'vest1') {
            $('.block1').show();
            $('.block2').hide();
        }
        if (vest === 'vest2') $('.block1, .block2').show();
        $('.vest').addClass('hide');
        $('.' + vest).removeClass('hide');
    };
    var hideVest = function ( ) {
        $('.block1, .block2').hide();
        $('.vest').addClass('hide');
    };
});

问候