Question

我有这个HTML代码，我有一些链接：

<select name="menu1" id="menu1">
  <option value="http://www.espn.com">ESPN</option>
  <option value="http://www.cnn.com">CNN</option>
  <option value="http://www.abcnews.com">ABC</option>
  <option value="http://www.cbsnews.com">CBS</option>
  <option value="http://www.foxnews.com">FOX</option>
</select>

和这个JavaScript：

var urlmenu = document.getElementById( 'menu1' );
urlmenu.onchange = function() {
  window.open( this.options[ this.selectedIndex ].value );
};

我希望链接在同一页面上打开，但它们目前在新窗口中打开。如何让它们在同一页面上打开？

Answer 1

open()始终会打开一个新窗口（或新选项卡，具体取决于您的浏览器）。

而是设置当前窗口的location：

urlmenu.onchange = function() {
  window.location.href = this.options.value;
};

（请注意，您不再需要通过options[selectedIndex]找到值 - value元素本身的<select>将会这样做

＆＃13;

var urlmenu = document.getElementById('menu1');

urlmenu.onchange = function() {
  document.location.href = this.value;
};

＆＃13;

<select name="menu1" id="menu1">
  <option>Choose:</option>
  <option value="http://www.espn.com">ESPN</option>
  <option value="http://www.cnn.com">CNN</option>
  <option value="http://www.abcnews.com">ABC</option>
  <option value="http://www.cbsnews.com">CBS</option>
  <option value="http://www.foxnews.com">FOX</option>
</select>

＆＃13;

Answer 2

您可以使用window.location = "http://www.example.com"转到其他链接（info）

<script type="text/javascript">
var urlmenu = document.getElementById('menu1');
urlmenu.onchange = function () {
    window.location = this.options[this.selectedIndex].value;
};
</script>

样本：

<html>

<head>
</head>

<body>
  <select name="menu1" id="menu1">
    <option value="http://www.espn.com" [1]>ESPN</option>
    <option value="http://www.cnn.com">CNN</option>
    <option value="http://www.abcnews.com">ABC</option>
    <option value="http://www.cbsnews.com">CBS</option>
    <option value="http://www.foxnews.com">FOX</option>
  </select>
  <script type="text/javascript">
    var urlmenu = document.getElementById('menu1');
    urlmenu.onchange = function() {
      window.location = this.options[this.selectedIndex].value;
    };
  </script>
</body>

</html>

Answer 3

根据w3：window.open() - 打开一个新窗口; window.location.assign()方法加载新文档。

因此请使用window.location.assign()。 Example

根据下拉列表选择加载新页面

3 个答案: