在选择选项上，从选择重定向到 html 页面

当用户从输入类型选择中选择任何特定选项时，我正在尝试将我的静态 html 页面重定向到另一个页面。

比方说。当用户从国家/地区下拉列表中选择美国时。重定向至谷歌。他们是否有任何简单的jquery或javascript来做到这一点。

提前致谢:)

您可以使用数据集元素

$("#select").change(function() {
  var option = $(this).find('option:selected');
  window.location.href = option.data("url");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="select">
  <option data-url="http://www.google.com">USA</option>
  <option data-url="http://www.twitter.com">Canada</option>
</select>

请做一个search以确保您快速找到您的问题。我之前在本主题中回答了这个问题：

如何根据"<选项>更改链接表单操作？

这就是你想要的。

试试这样的事情

$("#idselect").change(function(){
   var choice = $(this).val();
   switch(choice)
   {
       case "USA":
       window.location.url="www.google.com";
       break;
       case "ENG":
       window.location.url="www.google.com";
       break;
       default : 
       //Default action
       break;
   }
});

在 jquery 中，你可以执行以下操作

('#dropdown').change(function(){
window.location.href = "your new url";
});

使用以下代码：-

<select onchange="this.options[this.selectedIndex].value && (window.location = this.options[this.selectedIndex].value);">
    <option value="">Select...</option>
    <option value="http://google.com">USA</option>
    <option value="http://yahoo.com">Canada</option>
</select>

原文链接：-

<select>
 <option onclick="redirect()">USA<option>
</select>
 <script>
  function redirect(){
    window.location.href = 'http://www.google.com';
  }
  </script>

签出完整的 HTML，复制并保存在 HTML 扩展名中。

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script type="text/javascript">
 $( document ).ready(function() {
   $('select[name=country]').on("change", function(e){
      if($(this).val() == 'USA'){
          alert($(this).val());
          window.location.assign("http://www.w3schools.com")
      }
      //window.location.url="www.google.com";
   });
});
</script>
</head>
<body>
<Select name="country">
   <option value="India">India</option>
   <option value="USA">USA</option>
</Select>
</body>
</html>

希望这有帮助。

相关内容

最新更新

热门标签：