取决于输入信息的jQuery显示/隐藏

Question

我有3个简单的步骤来显示与3个步骤中输入的信息相关的答案。我正在使用this show/hide script，这很好但是我现在想要做的是当有人选择'伞员工'我想下一个问题出现在下面，同样如果我选择'自雇单一交易者'我想要一个不同的框出现在下面，然后最终根据输入的选项有一个答案（在这种情况下，相关的计划）

我不能让我的头轮如何做到这一点，因为我想每个选项必须记住为了结果匹配输入的信息。

这里是一个jsfiddle

这里是代码

HTML

<a href="#"><img src="http://www.paycoservices.co.uk/images/3-step-sfinder.png" width="968" height="100" class="show_hide" alt="3 steps" /></a> 

<div class="slidingDiv"> 
<img src="http://www.paycoservices.co.uk/images/step1.png" width="60" height="58" class="show_hide" alt="step 1" /> 
<font color=white><strong><h3>I want to work as:</h3></strong></font> <a href="#" class="show_hide"></a> 
<a href="#"><img src="http://www.paycoservices.co.uk/images/umbrella-emp.png" width="389" height="58" class="show_hide" alt="umbrella employee" /></a> 
<a href="#"><img src="http://www.paycoservices.co.uk/images/self-employed.png" style="float:right; width="473" height="58" class="show_hide" alt="umbrella employee" /></a> 
</div> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 

CSS

.slidingDiv { 
height:160px; 
width:928px; 
background-color: #84CFF4; 
padding:20px; 
margin-top:5px; 
border-bottom:5px solid #84CFF4; 
} 

.show_hide { 
display:none; 
} 

JS

$(document).ready(function(){ 

    $(".slidingDiv").hide(); 
    $(".show_hide").show(); 

$('.show_hide').click(function(){ 
$(".slidingDiv").slideToggle(); 
}); 

}); 

Answer 1

我不知道我是否正确地解决了您的问题！
但是，为什么你不给的链接的ID，然后检查

$("#umbrella").live("click", function() { 
shownext; 
}) 
$("#self").live("click", function() { 
showanother; 
}) 

，并为进一步的步骤，你做的，如果（...所示）

我希望我收到了你的问题的权利。