Javascript 在optgroup中选择一个选项后转到URL

我想学习如何使用JavaScript（或jQuery库）来访问一个url，该url指示为option标记在optgroup标记内的值

使用包含选项标记的简单的一级选择标记，解决方案可以类似于以下所述：

请选择一个项目：
HTML表单主页
HTML表单中的选项
表格
表单提交方法（GET和POST）

---

我尝试将它与一个两级select标记一起使用，option标记位于optgroup标记中，但它对我不起作用。如果您能帮助我修改此代码，我将不胜感激。

当用户选择一个选项时，请使用此选项：

$('select[name="SelectURL"]').change(function() {
    window.location.replace($(this).val());
});

或者，当用户单击“提交”按钮时：

$('form[name="nag"]').on('submit' function(e){
    e.preventDefault();
    window.location.replace($('select[name="SelectURL"]').val());
});

您还应该像这样清理HTML：

<FORM NAME="nav">
    <DIV>
        <SELECT NAME="SelectURL">
            <OPTION VALUE="http://www.cs.tut.fi/~jkorpela/forms/jsnav.html" SELECTED>Please select an item:</OPTION>
            <OPTION VALUE="http://www.cs.tut.fi/~jkorpela/forms/"> Main page on HTML forms</OPTION>
            <OPTION VALUE="http://www.cs.tut.fi/~jkorpela/forms/choices.html"> Choices in HTML forms</OPTION>
            <OPTION VALUE="http://www.cs.tut.fi/~jkorpela/forms/tables.html"> Tables and forms</OPTION>
            <OPTION VALUE="http://www.cs.tut.fi/~jkorpela/forms/methods.html"> Form submission methods (GET and POST)</OPTION>
        </SELECT>
    <DIV>
</FORM>

请选择一个项目：
HTML表单主页
HTML表单中的选项
表格
表单提交方法（GET和POST）

首先，去掉内联onChange事件处理程序：

<FORM NAME="nav"><DIV>
<SELECT NAME="SelectURL">
<OPTION VALUE="http://www.cs.tut.fi/~jkorpela/forms/jsnav.html"
SELECTED>Please select an item:
<OPTION VALUE="http://www.cs.tut.fi/~jkorpela/forms/">
Main page on HTML forms
<OPTION VALUE="http://www.cs.tut.fi/~jkorpela/forms/choices.html">
Choices in HTML forms
<OPTION VALUE="http://www.cs.tut.fi/~jkorpela/forms/tables.html">
Tables and forms
<OPTION VALUE="http://www.cs.tut.fi/~jkorpela/forms/methods.html">
Form submission methods (GET and POST)
</SELECT><DIV>
</FORM>

---

你必须关闭选项标签。说得好，@Seza。代码的功劳属于引用教程的作者。有没有办法在新窗口@Joe中打开它？您可以使用：

window.open（$（this.val（），“\u blank”）（顶部代码块）或
窗口。打开（$（'select[name=“SelectURL”]）.val（），'u blank'）
（第二个代码块）而不是
window.location.replace
。实际上，@Joe–出于某种原因，它在Safari、Chrome和IE中似乎不起作用。仅适用于FF–有关于如何修复此问题的建议吗？相当多的浏览器/广告拦截器会阻止它，以防止用户收到弹出窗口的垃圾邮件。最好的方法可能是
window.location.replace（）
，即使它不允许您在新窗口中打开它。不幸的是，即使使用location.replace，它在IE中也不起作用。我可以请你看一下实际页面吗，@Joe？非常感谢你，@Kirill！
<FORM NAME="nav"><DIV>
<SELECT NAME="SelectURL">
<OPTION VALUE="http://www.cs.tut.fi/~jkorpela/forms/jsnav.html"
SELECTED>Please select an item:
<OPTION VALUE="http://www.cs.tut.fi/~jkorpela/forms/">
Main page on HTML forms
<OPTION VALUE="http://www.cs.tut.fi/~jkorpela/forms/choices.html">
Choices in HTML forms
<OPTION VALUE="http://www.cs.tut.fi/~jkorpela/forms/tables.html">
Tables and forms
<OPTION VALUE="http://www.cs.tut.fi/~jkorpela/forms/methods.html">
Form submission methods (GET and POST)
</SELECT><DIV>
</FORM>

$(document).ready(function() 
{ 
  $('select[name=SelectURL]').change(function(v)
  {
    window.location.replace( $(this).val() );
  });
});