将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); 
});