Question

此页面按我希望的方式执行：http://www.web-source.net/javascript_redirect_box.htm

但是我想找到一个更好的使用jQuery的方法，有人能指出一个使用jQuery来完成这个的好脚本吗？

Answer 1

您不需要预先打包的脚本，只需要几行代码。

// get your select element and listen for a change event on it
$('#selectEl').change(function() {
  // set the window's location property to the value of the option the user has selected
  window.location = $(this).val();
});

Answer 2

其他人对如何做到这一点给出了很好的答案，但是......

只是一个警告，当有人通过键盘导航时，IE处理选择列表onChange与其他浏览器的区别非常不同。它将每个按键向上/向下按键计为onChange事件，这意味着您无法通过键盘导航重定向选择列表，从而导致无法使用鼠标的用户无法访问。（其他浏览器在触发onChange之前等待“enter”事件或选择列表中的选项卡。）我花了很长时间试图破解这个问题的解决方法，并且从未完全解决问题。 / p>

我不知道jQuery是否说明了这一点;希望它可以，为您的网站的可访问性。

可能值得让选择列表选择去哪里，然后在它旁边有一个按钮实际上激活重定向。（除非您不关心IE用户的可访问性。）

Answer 3

我没有对此进行测试，但我认为它等同于您引用的页面上的示例。

$(document).ready( function() {
   $('#select').change( function() {
      location.href = $(this).val();
   });
});

<select id="select">
    <option value="#">Select a location</option>
    <option value="location.htm">Location</option>
    <option value="other.htm">Other</option>
</select>

Answer 4

使用jQuery：

$('#selectEl').bind("change keyup",function()
{
  // set the window's location property to the 
  // value of the option the user has selected
  window.location = $(this).val();
});

适用于通常更改选项和箭头键。

您可能能够使用此扩展程序： http://plugins.jquery.com/project/mousewheel 尚未尝试过。：）

还可以在那里添加bind（）鼠标选项。请访问：api.jquery.com/category/events/mouse-events/ 任何函数都可以在该页面上显示name（）在上面的bind（）中使用它的'name'。就像我一样 change（）=＆gt;'change'和mouseup（）=＆gt;'mouseup' - 容易腻子:)）

和平！

Answer 5

正如丹尼尔所说，简单的答案是 - 你不应该这样做，这对可用性和可访问性都是不利的。

选择列表行为取决于用户的操作系统，浏览器和用户设置（两者）的组合。除此之外，onchange事件并非以跨浏览器的标准方式实现。

用户应该能够从选择列表中获得预期的行为，无论他们是使用鼠标，键盘还是鼠标滚轮还是（语音，屏幕阅读器，等等......）。如果你确实将一个事件绑定到onchange，那么它永远不应该是一个将用户的焦点从选择列表中移开的例子。页面重定向。

（我个人使用键盘导航网站形式很多，如果发生这种情况我会尖叫）

从选择下拉列表中选择项目时自动重定向

5 个答案: