如果用戶點擊兩次，如何強制複選框？

是否有可能必須在頁面加載時將兩個複選框顯示爲空白。但是，如果用戶點擊一個選項，那麼他們永遠不會點擊它 - 所以此刻用戶可以在選項之間切換，並且只能選擇一次。但是，如果他們按兩次勾號框，則刪除勾號。如果用戶點擊兩次，如何強制複選框？

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/

來源

2012-08-06 TheBlackBenzKid

使用單選按鈕來代替：：

更多隱藏整個線先進撥弄'' - 它們被設計來產生的確切行爲您正在尋找。 – Blazemonger 2012-08-06 13:54:08

單選按鈕是出於您的確切原因。使用它們 - 複選框不適合這個。 – 2012-08-06 13:55:21

@Blazemonger真是個白癡。海報要求複選框，而不是我們都知道的放射性複選框。 downvoting的意義何在？ Daft – M1th 2012-08-06 13:57:34

只要將它設置爲每點擊檢查：

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

FIDDLE

或避免滑動以及：

$(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; 
     } 
    }); 
});

FIDDLE

來源

2012-08-06 13:55:31 adeneo

$("input:checkbox").change(function(){ 

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

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

    //rest of your code... 

});

小提琴：

來源

2012-08-06 13:56:24 Neal

這看起來像一個設計極其糟糕的互惠複選框，說實話... – 2012-08-06 14:13:16

如果用戶點擊兩次，如何強制複選框？

回答

相關問題