我正在使用WordPress 3.5。我需要一种实现代码或插件的方法，允许用户使用依赖（链接）下拉列表浏览帖子。
换句话说，我希望3个下拉菜单能够根据之前下拉列表中选择的内容动态填充。
这将包括：
Dropdown 1: Category*
Dropdown 2: Sub- Category*
Dropdown 3: List of posts in Sub-Category*
*下拉列表1将预先填充类别。
*下拉列表2将根据用户选择列出菜单1的子类别。
*下拉列表3将列出在菜单2中选择的子类别中的帖子。
为了帮助您进一步了解，在我的网站上，我有一个类别“电视剧”，它作为子类别（儿童）其他系列，如“Dexter”，“CSI：Miami”等。系列还有其他子类别（儿童）季节数，如
1. "Season 1"
2. "Season 2"
3. "Season N".
每个季节都有相应的帖子。
层次结构如下所示：
电视剧（主要类别）
Dexter
Season 1
Season 2
Season n
CSI:Miami 1. Season 1
2. Season 2
3. Season n
例如，我想使用的动态下拉列表如下：
Dropdown 1: Select TV Show (Category)
Dropdown 2: Select Season (sub-category)
Dropdown 3: Select Episode (posts)
我在网上搜索了几天，没有任何结果。
我已经尝试了一个名为Category Ajax Chain Selects 但它已经过时，不能正常工作。
SO网友:john
你可以找到你的答案here 这里有一个demo 是的。
HTML代码示例
<div class="ccms_form_element cfdiv_custom" id="style_container_div">
<label for="brand">Make:</label>
<select size="1" id="make" class=" validate[\'required\']" title="" onChange="updatepage();" type="select" name="style">
<option value="-1">–Choose a Make-</option>
<option class="Audio" value="Audi">Audi</option>
<option class="BMW" value="BMW">BMW</option>
</select>
<div class="clear"></div><div id="error-message-style"></div>
<div id="style-sub-1" class="BMW" style="display: none;" name="stylesub1" onchange="ChangeDropdowns(this.value)">
<label for="brand">Model:</label>
<select name="cat" id="cat" class="postform">
<option value="-1">–Choose a Model-</option>
<option class="level-0" value="172">1 Series</option>
<option class="level-0" value="173">2 Series</option>
<option class="level-0" value="106">3 Series</option>
</select>
</div>
<div id="style-sub-1" class="Audi" style="display: none;" name="stylesub1" onchange="ChangeDropdowns(this.value)">
<label for="brand">Model:</label>
<select name="cat" id="cat" class="postform">
<option value="-1">–Choose a Model-</option>
<option class="level-0" value="169">A1</option>
<option class="level-0" value="170">A3</option>
<option class="level-0" value="171">A4</option>
</select>
</div>
<div class="clear"></div>
<div id="error-message-style-sub-1"></div></div>
JS代码
$("#make").change ( function () {
var targID = $(this).val ();
$("div#style-sub-1").hide ();
$(\'.\' + targID).show ();
});
您应该考虑包括jQuery并将代码移出要调用的函数。
