jQuery下拉列表加载内容 [英] Jquery dropdown loading content

问题描述

我正在尝试找到一些jQuery，使我可以使用下拉菜单在网站上加载特定内容.具体来说，我们有一些特定于州的文档.我想在下拉菜单中列出州.用户将选择他们的州，然后查看其州特定的文档.

I'm trying to find some jquery that will allow me to use a dropdown to load specific content on the website. Specifically we have some documents that are state specific. I'd like the drop-down to have the states listed. The user will select their state and then view their state specific docs.

只有少数几种状态，因此不需要使用数据库或动态拉动它们.

There will only be a few states, so there is no need to use a database or to pull them dynamically.

任何帮助将不胜感激.

推荐答案

如果您使用的是jQuery，则只需列出要显示的部分作为选择的选项值，然后使用jQuery的change事件显示每个部分.

If you're using jQuery you can just list the section you want to show as your select's option value and then show each using jQuery's change event.

$(document).ready(function() {
   $('#myselector').change(function(){
      $('.statecontent').hide();
      $('#' + $(this).val()).show();    
   });
});

您的HTML看起来像这样

Your HTML would look like this

<select id="myselector">
   <option value="state1">State 1</option>
   <option value="state2">State 2 </option>
   <option value="state3">State 3</option>
</select>

<div id="state1" class="statecontent">State1 Specific Page Content Goes here</div>
<div id="state2" class="statecontent">State2 Specific Page Content Goes here</div>
<div id="state3" class="statecontent">State3 Specific Page Content Goes here</div>

这篇关于jQuery下拉列表加载内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！