简单的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'); }); }); });
所需的切换效果不起作用.单击一个单选框无法隐藏另一个.
有任何想法吗?
解决方法
<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'); }); });