如何使选择选项第一个值不重定向到任何页面

Question

我在"无结果"页面中显示了一个下拉列表。

这就是我正在做的

<label for="chewie"></label>
 <select name="chewie" id="chewie" onchange="redirect()">
  <option > Select Option</option>
  <option value="www.item1.com">Item1</option>
  <option value="www.item1.com">Item1</option>
  <option value="www.item1.com">Item1</option>
  <option value="www.item1.com">Item1</option>
 </select>

如果用户选择"项 1"，它将重定向到项 1 页。当他单击后退按钮并选择"选择选项"时，它应该停留在此下拉列表所在的页面上。

但是现在，当用户选择"选择选项"时，它会转到404页面，显然找不到。

我不希望第一个选项重定向到任何页面。我应该提供什么值才能使其不会重定向到任何其他页面？

Answer 1

您可以使用

<option disabled>Select Option</option>，因此无法单击该选项。

Answer 2

也许您可以使用像 value="#"这样的锚值

Answer 3

只需从 option 标记中的 value 属性中删除urls

  <label for="chewie"></label>
  <select name="chewie" id="chewie" onchange="redirect()">
  <option> Select Option</option>
  <option>Item1</option>
  <option>Item2</option>
  <option>Item3</option>
  <option>Item4</option>
 </select>

Answer 4

另一种选择是在Javascript中放置一些东西以防止它重定向。假设第一个选项始终是占位符，因此您希望忽略该操作...您可以检查所选索引，并且仅在索引大于零时才执行该操作。

function redirect() { 
  //capture the selection 
  var dropdown = document.getElementById("chewie");
  if(dropdown.selected_index > 0)
  { 
     //redirect the user 
     var redirect_url = dropdown.options[selected_index].value;
     window.location = redirect_url; 
  }
  return false;
}

此外，您可能希望将http://放在 URL 前面...在我的浏览器中，如果没有它，他们就无法正确重定向。