2012-05-01 70 views
0

首先,我在這裏搜索過去的一小時,看看我發佈之前是否找到了我的問題的答案,但您是我的最後希望!我發現一段代碼幾乎可以按我的需要工作,但並不完全。jquery - 顯示基於單選按鈕檢查div?

  • 我需要擺脫淡入和淡出。
  • 我需要腳本來檢查onload哪個單選按鈕被選中並顯示正確的div。

這裏是我的代碼:

<input type="radio" name="d_method" class="c_email"/>Email 
<input name="d_method" type="radio" class="c_collection"/>Colletion 
<input name="d_method" type="radio" class="c_post"/>Post 

<div id="c_email" style="display:none;"> 
    email textbox 
</div> 
<div id="c_collection" style="display:none;"> 
    collection textbox 
</div> 
<div id="c_post" style="display:none;"> 
    post textbox 
</div> 

這裏是jQuery的:

$(':radio').change(function() { 
    var itemSelector = '#' + $(this).attr('class'); 
    $('div').stop().fadeOut(function() { 
     $(itemSelector).fadeIn(); 
    }); 
}); 
+0

什麼不能在你的腳本中工作 –

+0

單選按鈕應該保存一個值...比你使用'.prop()'... bla bla bla等等。 –

+0

可能的重複http://stackoverflow.com/q/8121577/448232和http://stackoverflow.com/a/4108027/448232。 –

回答

3

試試這個

$(function(){ 
    $(':radio').click(function() { 
     $('#' + $(this).attr('class')).fadeIn().siblings('div').hide(); 
    }) 
    .filter(':checked').click();//trigger the click event 
});​ 

工作演示 - http://jsfiddle.net/H8VVP/1/

+0

完美的作品,非常感謝! :) – user1227914