取決於輸入信息的jQuery顯示/隱藏

我有3個簡單的步驟來顯示與3個步驟中輸入的信息相關的答案。我正在使用this show/hide script，這很好但是我現在想要做的是當有人選擇'傘員工'我想下一個問題出現在下面，同樣如果我選擇'自僱單一交易者'我想要一個不同的框出現在下面，然後最終根據輸入的選項有一個答案（在這種情況下，相關的計劃）取決於輸入信息的jQuery顯示/隱藏

我不能讓我的頭輪如何做到這一點，因爲我想每個選項必須記住爲了結果匹配輸入的信息。

這裏是一個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; 
}

$(document).ready(function(){ 

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

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

});

來源

2013-07-02 JFar_13

我不知道我是否正確地解決了您的問題！
但是，爲什麼你不給的鏈接的ID，然後檢查

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

，併爲進一步的步驟，你做的，如果（...所示）

我希望我收到了你的問題的權利。

來源

2013-07-02 10:49:42 Wikunia

我想你的問題是對的，有沒有什麼辦法可以編輯我的jsfiddle，這樣我就可以看到它應該是什麼樣子了？ http://jsfiddle.net/Xg8rz/ –

檢查http://jsfiddle.net/Xg8rz/3/ – softsdev

謝謝softsdev，但我真的不知道足夠的JS知道如何使一個新的div出現在下面，而不是警報消息。 –

取決於輸入信息的jQuery顯示/隱藏

回答

相關問題