jQuery 使用 URL 哈希选择选项表单

Question

我正在尝试使用URL HASH来选择选项，并且在选项更改时，URL哈希更改。我有两个脚本，它们独立工作，但不能一起工作。有解决办法吗？目前它适用于选择 Apple 的 url.com/#Apple。但是当我将选择更改为橙色时，URL 不会更改为 url.com/#Orange Fiddle http://jsfiddle.net/q33zevup/1/

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

 <script>
    $('#myselect').change(function(){
        var url = $(this).val();
        window.location.hash = url;
    });
    </script> 
    <script>
    jQuery.noConflict();
    window.addEventListener('hashchange', fn, false);

    window.onload = fn; // fire on pageload

    function fn() {
        document.getElementById('myselect').value = window.location.hash.replace('#','');
    }
    </script>

Answer 1

在更改 javascript 中的“myselect”以匹配 html 中的“mySelect”（大小写差异）后，它对我有用。 http://jsfiddle.net/q33zevup/3/

$(function(){
    $('#mySelect').change(function () {
        var url = $(this).val();
        window.location.hash = url;
        console.log('select Changed');
    });
});
window.addEventListener('hashchange', fn, false);

window.onload = fn; // fire on pageload

function fn() {
    $('#mySelect').val(window.location.hash.replace('#', ''));
    console.log("hash = " + window.location.hash);
}