选择选项更改时更改页面

Question

当我更改选项时，页面不会改变 我想将页面更改为'（value）.html'。

function countryHandler() {
  var x = document.getElementsByID("country").value;
  window.location.href = "";
}

<select id="country" onclick="countryHandler();">
  <option value="">Country...</option>
  <option value="KR">Korea</option>
  <option value="US">United States of America</option>
</select>

Answer 1

 <select id="country" onchange="countryHandler(this.value)">
    <option value="">Country...</option>
    <option value="KR">Korea</option>
    <option value="US">United States of America</option>
</select>
<script>
    function countryHandler(value) {
        window.location.assign(`${value}.html`);
    }
</script>

你必须在选择部分听取改变。

Answer 2

使用
window.location('http://example.com');
或
window.location.assign('http://example.com');

Answer 3

onchange属性在元素值更改时触发。

function urlHandler(value) {                               
    window.location.assign(`${value}`);
}

<select id="url" onchange="urlHandler(this.value)">
    <option disabled selected value>Select Option</option>
    <option value="https://techne.africa">TechNe Africa</option>
    <option value="https://google.com">Google</option>
    <option value="https://facebook.com">Facebook</option>
    <option value="https://twitter.com">Twitter</option>
    <option value="https://instagram.com">Instagram</option>
    <option value="https://youtube.com">YouTube</option>
    <option value="https://linkedin.com">LinkedIn</option>
</select>