2014-02-09 73 views
0

我有單選按鈕,可打開的3周不同的div(一次一個)如何使聚焦出

在第二個div後場消失,我加入4-文本輸入,使每一位應該後打開點擊上一個(點擊(功能()))。一旦它們被打開,當我選擇另一個單選按鈕和實際的div隱藏時,我希望它再次隱藏。

這是怎麼做到的?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 

<script type="text/javascript"> 
$(document).ready(function() { 
    $("input[name$='cars']").click(function() { 
     var test = $(this).val(); 
     $("div.desc").hide(); 
     $("#Cars" + test).fadeIn(2000); 
    }); 
    //fim 
    //inicio 
    $("#campo1").click(function(){ 
     $("#musicinfo").show("slow") 
    }); 
    //fim 
    //inicio 
    $("#musicinfo").click(function(){ 
     $("#music2").show("slow") 
    }); 
    //fim 
    //inicio 
    $("#music2").click(function(){ 
     $("#music3").show("slow") 
    }); 
    //fim 
}); 
</script> 

<link rel="stylesheet" type="text/css" href="estilo.css"> 
<title>Documento sem título</title> 
</head> 
<body> 

2 Cars<input type="radio" name="cars" checked="checked" value="2" /> 
3 Cars<input type="radio" name="cars" value="3" /> 
4 cars<input type="radio" name="cars" value="4" /> 

<div id="Cars2" class="desc"> 
    2 Cars Selected 
</div> 
<div id="Cars3" class="desc" style="display: none;"> 
    <input type="text" id="campo1"><br> 
    <div id="musicinfo"><input type="text" id="xxx" name="non"/></div> 
    <div id="music2"><input type="text" id="eee" name="uuu"/></div> 
    <div id="music3"><input type="text" id="www" name="ttt"/></div> 
</div> 
<div id="Cars4" class="desc" style="display: none;"> 
    4 Cars 
</div> 


</body> 
</html> 

回答