2013-07-11 39 views
0

寬度添加罰款與點擊,但我想減少它,當我取消選中任何複選框像toogle時,我將如何獲取未選中的事件切換寬度未選中。與jQuery的Chceckbox事件:我如何得到未經檢查的事件,以取消選中的寬度

<!DOCTYPE html> 
<html> 
<head> 
<style> 
.one { 
    color:red; 
} 
.static {width:150px; background:#999; margin:50px;} 
</style> 
<script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
</head> 
<body> 
<form> 
    <p> 
    <input type="checkbox" name="newsletter" value="Hourly" class="compare_checkbox"> 
    <input type="checkbox" name="newsletter" value="Daily" class="compare_checkbox"> 
    <input type="checkbox" name="newsletter" value="Weekly" class="compare_checkbox"> 
    <input type="checkbox" name="newsletter" value="Monthly" class="compare_checkbox"> 
    <input type="checkbox" name="newsletter" value="Yearly" class="compare_checkbox"> 
    </p> 
</form> 
<div class="one"></div> 
<script> 
    $(document).ready (function(){ 
     var countChecked = function() { 
      var n = $("input.compare_checkbox:checked").length; 
      $("div.one").text(n + (n === 1 ? " is" : " are") + " checked!"); 
      var w = ($(".static").width()); 
      $(".static").css("width", "+=150"); 
      alert(w); 
     }; 
     countChecked(); 
     $("input.compare_checkbox").on("click", countChecked); 

    }); 
</script> 
<div class="static">1234</div> 
</body> 
</html> 
+0

我們是否OK,你想要做什麼SI:用戶檢查所有複選框 - >寬度的增加,用戶取消選中任何複選框 - >寬度降低? – MisterJ

回答

0

希望這會幫助你

//listen for checkbox click 
$('.compare_checkbox').on('click', function(){ 
    //check current state of checkbox 
    if($(this).is(':checked')){ 
     //expand width 
    } 
    else{ 
     //reduce width 
    } 
}); 
+0

It's Done ....謝謝..... – Ajoshi

相關問題