使用Javascript基于URL哈希设置所选选项

时间:2015-02-24 17:39:50

标签: javascript forms url hash option

<select id="mySelect">
    <option>Apple</option>
    <option>Orange</option>
    <option>Pineapple</option>
    <option>Banana</option>
</select>

<button onclick="myFunction()">Try it</button>

<script>
    function myFunction() {
        document.getElementById("mySelect").options.selectedIndex = "2";
    }
</script>

此脚本选择&#34; Pineapple&#34;单击按钮时。我想做同样的事情,除了它应该在刷新时立即选择。另外,我想基于URL哈希设置所选选项,而不是使用selectedIndex

所以:myname.com/#this

if location.hash == 'this'然后将选项设置为选中的相等值。

如果它正在检查location.hash,那么我就不需要使用onload,因为它会自动从网址中提取信息。我知道这很简单,我只是不能很好地了解JavaScript以便将它放在一起。

1 个答案:

答案 0 :(得分:2)

您通常只是听取hashchange事件

window.addEventListener('hashchange', fn, false);

window.onload = fn; // fire on pageload

function fn() {
    document.getElementById('mySelect').value = window.location.hash.replace('#','');
}