jquery - 选择一个单选按钮交叉淡入淡出 div onclick

Question

我在谷歌上搜索了这个，但什么也没有。我要离开我盯着和发现的东西。

我有多个单选按钮，我需要在选中时更改相应的 DIV。 我需要免费的值，所以 onlclick 命令会更好。 PS：如果我可以让它 fxfade 而不是上下滑动它也会有所帮助。

按钮

  <input type="radio" name="myRadio" value="myDiv_1" />MyDiv2<br />
    <input type="radio" name="myRadio" value="myDiv_2" />MyDiv3<br />
    <input type="radio" name="myRadio" value="myDiv_3" />MyDiv4<br />

div的

<div id="myDiv_1" class="MyDiv">Div number 1!</div>
<div id="myDiv_2" class="MyDiv">Div number 2!</div>
<div id="myDiv_3" class="MyDiv">Div number 3!</div>

目前为止的代码

    <script type="text/javascript">
$(document).ready(function(){

    $('.MyDiv').hide();

    $('input[name="myRadio"]').change(function(){
        var selected = $(this).val();
        $('.MyDiv').slideUp();
        $('#'+selected).slideDown();
    });

});
</script>

Answer 1

您的代码不起作用吗？您的 slideUp() 和 slideDown() 将同时发生，因此您可能想要使用回调（这里我认为您想要使用淡入淡出）：

$('input[name="myRadio"]').click(function() {
    var selected = $(this).val();
    $('.MyDiv').fadeOut("slow",function() {
        $('#' + selected).fadeIn("slow");
    });
});