1

ページロード時に2つのチェックボックスが空白として表示されるようにすることは可能ですか。ただし、ユーザーがオプションをクリックした場合、クリックすることはできません。そのため、現時点では、ユーザーはオプションを切り替えることができ、チェックできるのは1回だけです。ただし、チェックボックスを2回押すと、チェックマークが削除されます。

HTML

My Billing Address is the same <input type="checkbox" class="sameCheck" name="toggleOracleAddress" id="toggleOracleAddress" value="SAME" /> <br /> <br />
My Billing Address is the different <input type="checkbox" class="sameDifferent" name="toggleOracleAddress" id="toggleOracleAddress" value="DIFFERENT" />

jQUERY

$(document).ready(function(){
    //////////////////
    //####     SAME ADDRESS
    //////////////////
    $('.sameCheck').click(function() {
        $('.sameDifferent').removeAttr('checked');
        $('#proceedIsOn').slideUp();
    });
    //////////////////
    //####     DIFFERENT ADDRESS
    //////////////////
    $('.sameDifferent').click(function() {
        $('.sameCheck').removeAttr('checked');
        $('#proceedIsOn').slideDown();    
    });
});

JSFIDDLEはこちらhttp://jsfiddle.net/mRwMt/

4

2 に答える 2

3

クリックするたびにチェックするように設定するだけです：

$(document).ready(function(){
    $('.sameCheck').click(function() {
        this.checked = true;
        $('#proceedIsOn').slideUp();
    });
    $('.sameDifferent').click(function() {
        this.checked = true;
        $('#proceedIsOn').slideDown();    
    });
});​

フィドル

またはスライドを避けるためにも：

$(document).ready(function(){
    $('.sameCheck').click(function() {
        if (!this.checked) return false;
        $('#proceedIsOn').slideUp();
    });
    $('.sameDifferent').click(function() {
        if (!this.checked) return false;
        $('#proceedIsOn').slideDown();    
    });
});​

または、ボックスを切り替えるだけです。

$(document).ready(function(){
    $('.sameCheck').click(function() {
        if (this.checked) {
            $(this).siblings('input[type"text"]').prop('checked', false);
            $('#proceedIsOn').slideUp();
        }else{
            return false;
        }
    });
    $('.sameDifferent').click(function() {
        if (this.checked) {
            $(this).siblings('input[type"text"]').prop('checked', false);
            $('#proceedIsOn').slideDown();
        }else{
            return false;
        }
    });
});​

フィドル

于 2012-08-06T13:55:31.203 に答える
0 
$("input:checkbox").change(function(){

     var otherBox = $("input:checkbox").not(this);

     if($(this).is(":checked"))  otherBox.hide();
     else   otherBox.show();

     //rest of your code...

});

フィドル： http： //jsfiddle.net/maniator/mRwMt/2/

行全体を隠すより高度なフィドル：http：//jsfiddle.net/maniator/mRwMt/3/

于 2012-08-06T13:56:24.263 に答える