当您选择带有jquery的单选按钮时，如何在div中滑动

Question

我正计划使用PHP进行以下html输出。现在当我选择一周时，我想在周div中滑动，选择日，日div等。

如何使用jquery来完成它。

<div id="main">
 <form>
<div id="week_day_time">

<input type="radio" name="week_day_time" value="week" />Week<br />
<input type="radio" name="week_day_time" value="day" />Day<br />
<input type="radio" name="week_day_time" value="time" />Time

</div>
<div id="week">
more form for week.
originally hidden by css. But it will open when you select a week radio button.
more form for week
</div>
<div id="day">
more form...
originally hidden by css. But it will open when you select a day radio button.
more form for day
</div>
<div id="time">
more form...
originally hidden by css. But it will open when you select a time radio button.
more form for time
</div>
</form> 
</div>

Answer 1

试试这个：

var current = '';
$('[name="week_day_time"]').change(function() {
    if(current.length) 
        $('#' + current).slideUp();
    current = $(this).val();
    $('#' + $(this).val()).slideDown();
});

Working Example

Answer 2

我或多或少会做以下事情： http://jsfiddle.net/dactivo/dhwZY/

我会将文本包装在一个名为“文本”的div中，并执行以下功能：

$('input[name="week_day_time"]').click(function() {

    $("#texts").children().slideUp();
    $('#' + $(this).val()).slideDown();

});