jQuery 制作跳转菜单（HTML 选择下拉菜单）的最佳方法是什么？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2138998/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
What is the best way to make jump menu (HTML select dropdown)?
提问by Jitendra Vyas
Every <option>in an HTML <select>will have external URL and should open in new a window. If it's possible to make in CSS and HTML only then good, if not possible without JavaScript then it should be unobtrusive.
<option>HTML 中的每一个<select>都有外部 URL，应该在新窗口中打开。如果只有在 CSS 和 HTML 中制作才好，如果没有 JavaScript 就不可能，那么它应该是不显眼的。
回答by bobince
The “jump menu” is a discredited navigational device from many years ago that should not be brought back.
“跳转菜单”是多年前的一个名不见经传的导航设备，不应该带回来。
Auto-navigate-on-change <select>menus are unsuitable for navigation because:
自动导航更改<select>菜单不适合导航，因为：
keyboard users will be firing a change event every time they move the selection, making it impossible for them to use the control;
non-JavaScript agents (including search engines) won't be able to see or follow the links;
form values are retained over page back/forward navigations, making the select show the wrong value after a navigation, making it impossible to select the same option again;
users can't use their browser's normal navigational tools like middle-click, ‘open in new tab' or ‘bookmark link'.
键盘用户每次移动选择时都会触发更改事件，使他们无法使用控件；
非 JavaScript 代理（包括搜索引擎）将无法查看或访问链接；
表单值保留在页面后退/前进导航上，使选择在导航后显示错误的值，从而无法再次选择相同的选项；
用户无法使用浏览器的常规导航工具，例如中键、“在新标签页中打开”或“书签链接”。
Therefore the ‘best' way to make a jump menu is not to. If you want something that behaves similarly but doesn't have these disadvantages, go for a <div>that's hidden and re-popped-up by JavaScript, containing plain <a>links pointed at the pages they go to. You can style it to look like a dropdown if you really want, and you can make them open new windows when left-clicked if you must (I wish you wouldn't, though).
因此，制作跳转菜单的“最佳”方法是不要。如果您想要一些行为相似但没有这些缺点的东西，请选择一个<div>由 JavaScript 隐藏并重新弹出的东西，其中包含<a>指向它们所到页面的纯链接。如果你真的想要，你可以将它的样式设置为看起来像一个下拉菜单，如果你必须的话，你可以让它们在左键单击时打开新窗口（但我希望你不会）。
回答by DisgruntledGoat
You can't open links from <select>elements without Javascript. The way to open a new Window with Javascript is like this:
如果<select>没有 Javascript，您将无法打开来自元素的链接。用Javascript打开一个新窗口的方法是这样的：
window.open("http://example.com");
To attach to the <select>element, try this:
要附加到<select>元素，请尝试以下操作：
$('#selectId').change( function() {
window.open( $(this).val() );
}
Assuming the URL is set in the valueattribute of each <option>element.
假设在value每个<option>元素的属性中设置了 URL 。
