將jQuery添加到表單以顯示/隱藏下拉菜單

Question

我想將一些jQuery添加到Wordpress網站，以便當用戶在頂部下拉菜單中選擇某個選項（軟件）時，另一個出現在它下面。

我使用下面的代碼 -

<p id="parent-menu"> 
    <select name='cat' id='cat' class='dropdown' tabindex="40"> 
     <option value='-1'>Select a Category</option> 
     <option class="level-0" value="13">Software problem</option> 
     <option class="level-0" value="14">Hardware problem</option> 
     <option class="level-0" value="15">Suggestion</option> 
     <option class="level-0" value="16">General query</option> 
    </select> 
</p> 
<p id="toggle-menu"> 
    <select name='cat' id='cat' class='dropdown' tabindex="50"> 
     <option value='-1'>Select a Program</option> 
     <option class="level-0" value="6">BigHand</option> 
     <option class="level-0" value="7">IRIS</option> 
     <option class="level-0" value="8">MS Outlook</option> 
     <option class="level-0" value="9">MS Word</option> 
     <option class="level-0" value="10">MS Excel</option> 
     <option class="level-0" value="11">Oyez</option> 
     <option class="level-0" value="12">Internet Explorer</option> 
    </select> 
</p> 

ID來感激，如果有人可以幫助我做到這一點。

謝謝。

Answer 1

我不是WordPress的是如何處理的JQuery完全確定，但如果我是在PHP寫這一點，會是這樣的。我會將分類學改爲id或value。查詢將進入我的按鈕點擊。您需要更改每個點擊實例的ID。

$(".class#id").toggle(); 
$(".dropdown#software").toggle(); 

好的。所以在你的新信息。由於我可以使用一個特定的ID。在選擇選項13時，您需要包含一些內容來檢查您的代碼頁。當選擇這個選項時，你需要這樣的東西。

$("#toggle-menu").toggle(); 

或

$("#toggle-menu").show(); 

現在，這裏的想法是，如果你有這樣的動作或事件中使用切換（基於期權的選擇）會顯示或隱藏切換菜單取決於選擇，即我選擇了它，一旦它會出現，我取消選擇或再次選擇菜單消失。使用show（）將使切換菜單顯示但不隱藏它，如果取消選擇，在這種情況下，您希望在所有其他事件選擇中使用hide（）來隱藏切換菜單。

Answer 2

如果你使用jQuery UI您可能會發現埃裏克·海因茲插件有用：http://www.erichynds.com/jquery/jquery-ui-multiselect-widget/

Answer 3

假設切換菜單不在乎在第一個菜單中選擇了什麼，你想要的是這個

$('#parent-menu').change(function(event) 
{ 
    $('#toggle-menu').show(); 
}); 

$('#toggle-menu').change(function(event) 
{ 
    var selections = $('#parent-menu').val() + ' ' + $('#toggle-menu').val(); 
    alert(selections); 
});