Question

我想在带有选择框的网站上导航。当用户更改select-option时，它会打开此选项的URL。

这是我的选择：

<select id="navigation">
   <option value="/" selected>start</option>
   <option value="/thoughts">thoughts</option>
   <option value="/work">work</option>
   <option value="/methods">methods</option>
</select>

这是我的javascript：

document.getElementById("navigation").onchange = function() {
  var selectedOption = this.value;
  window.location.href = "http://niklasjordan.com" + selectedOption;
}

但是这段代码不起作用。有谁知道为什么？

Answer 1

假设您正在使用vanilla Javascript，请将您的代码放在此函数中：

var domReady = function(callback) {
    document.readyState === "interactive" || document.readyState === "complete" ? callback() : document.addEventListener("DOMContentLoaded", callback);
};

domReady(function() {
    document.getElementById("navigation").onchange = function() {
        var selectedOption = this.value;
        window.location.href = "http://niklasjordan.com" + selectedOption;
    }
});

（这仅适用于IE9及以上版本）

简短说明：你必须等待你的DOM完全加载才能操作它！

Answer 2

感谢您的帮助，伙计们！

解决方案非常简单：我在封闭的正文标记之前将代码放在头部。瞧！它运行...

如何使用Select导航到URL？

2 个答案: