jQuery Toggle div với nút radio

Question

Simple html & jQuery

<label><input id="rdb1" type="radio" name="toggler" value="1" />Money</label> 
<label><input id="rdb2" type="radio" name="toggler" value="2" />Interest</label> 

<div id="blk-1" style="display:none"> 
    ... 
</div> 
<div id="blk-2" style="display:none"> 
    ... 
</div> 

$(function() { 
    $("[name=toggler]").each(function(i) { 
     $(this).change(function(){ 
      $('#blk-1, #blk-2').hide(); 
      divId = 'blk-' + $(this).val(); 
      $("#"+divId).show('slow'); 
     }); 
    }); 
}); 

Hiệu quả chuyển đổi mong muốn không hoạt động mặc dù. Nhấp vào một hộp radio sẽ không ẩn được.

Bất kỳ ý tưởng nào?

Answer 1

<label><input id="rdb1" type="radio" name="toggler" value="1" />Money</label> 
<label><input id="rdb2" type="radio" name="toggler" value="2" />Interest</label> 

<div id="blk-1" class="toHide" style="display:none"> 
    money 
</div> 
<div id="blk-2" class="toHide" style="display:none"> 
    interest 
</div> 

$(function() { 
    $("[name=toggler]").click(function(){ 
      $('.toHide').hide(); 
      $("#blk-"+$(this).val()).show('slow'); 
    }); 
}); 

như trong http://www.jsfiddle.net/eKFrW/

Answer 2

$("input:radio").click(function(){ 
    $("div").hide(); 
    var div = "#blk-"+$(this).val(); 
    $(div).show(); 
}); 

trực tuyến giới thiệu ở đây: http://jsfiddle.net/yLJPC/

Answer 3

Heres những gì bạn muốn tôi nghĩ. Để bắt đầu, tôi sẽ làm cho nút radio đầu tiên được chọn và div đầu tiên hiển thị. Sau đó, nút chuyển đổi sẽ hoán đổi số div

$("input:radio").click(function(){   
    $('#blk-1').toggle(); 
    $('#blk-2').toggle(); 
});