JQuery：选择第一个 DDL 的元素时动态加载第二个 DDL
我对 JQuery 比较陌生，我有一个带有下拉列表的网页。当用户选择下拉列表的元素时，应显示取决于第一下拉列表的选择的第二下拉列表。下拉列表的内容是已知的且恒定的，因此可以在页面上进行硬编码，无需使用 AJAX 调用加载内容。 例如：
<select id="country" name="country">
<option value="US">USA</option>
<option value="CA">Canada</option>
<option value="MEX">Mexico</option>
</select>
当用户选择“美国”时：加载包含美国各州的第二个下拉列表。
当用户选择“加拿大”时：加载带有加拿大省份的第二个下拉列表
当用户选择“墨西哥”时：加载带有墨西哥省份的第二个下拉列表等。
虽然这看起来像是网页的非常标准和基本的要求，但我只能找到代码示例使用 AJAX 从服务器加载第二个下拉列表的内容。这使得代码示例过于复杂，我相信有一个更简单的解决方案。
I am relatively new to JQuery and I have a webpage with a drop down list. When the user selects an element of the drop down list, a second drop down list depending on the choice of the first drop down list should be displayed. The contents of the drop down lists are known and constant and can thus be hardcoded on the page, no need to load something using an AJAX call.
For example:
<select id="country" name="country">
<option value="US">USA</option>
<option value="CA">Canada</option>
<option value="MEX">Mexico</option>
</select>
When user selects "USA": load second drop down list with US states.
When user selects "Canada": load second drop list with Canadian provinces
When user selects "Mexico": load second drop down list with Mexican provinces etc.
Although this looks like a very standard and basic requirement for a webpage I could only find code examples that use AJAX to load the contents of the second drop down list from a server. This made the code sample too complex, I am sure there is a far easier solution.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
看看这个。
http://jsfiddle.net/qjgCY/1/
check out this.
http://jsfiddle.net/qjgCY/1/
我能想到的最简单的解决方案是将要填充第二个下拉列表的元素声明为存储为页面中 JavaScript 变量的地图（assoc 数组）。
将更改绑定附加到第一个，在该处理程序中，更新第二个下拉列表。
Simplest solution I can think of would be to declare the elements you want to populate the second drop down with as a map (assoc array) stored as a javascript variable in the page.
Attach a change binding to the first, in that handler, update the second drop down.
此目标只能使用 ajax。
如果您使用.NET，那么您可以使用“级联下拉列表”，但它也会在幕后发出ajax请求。
Only ajax is possible for this target.
If you use .NET then you can use "cascade drop down list", but it also behind scene makes ajax requests.