在javascript中更改下拉框时更改路径URL

时间:2014-10-23 09:31:03

标签: javascript jquery

您好我想在我的页面上更改下拉框时更改URL的路径。

<select id="SelectLocation" class="large" data-bind="value: StoreLocationSelected" >
<option value="0" label="choose one"></option>
<option>1</option>
<option>1</option>
<option>1</option>
<option>1</option> 
</select>

当在下拉列表中更改选项时,我希望页面使用我要求的相关URL路径重新加载。有什么建议?

由于

5 个答案:

答案 0 :(得分:2)

您可以使用以下方法。

<select id="dynamic_select">
    <option value="" selected>Pick a Website</option>
    <option value="http://www.google.com/">Google</option>
    <option value="http://www.youtube.com/">YouTube</option>
    <option value="http://www.stackoverflow.com/">Stack Overflow</option>
</select>

<script>
    $(function(){
      // bind change event to select
      $('#dynamic_select').bind('change', function () {
          var url = $(this).val(); // get selected value
          if (url) { // require a URL
              window.location = url; // redirect
          }
          return false;
      });
    });
</script>

小提琴:http://jsfiddle.net/kiranvarthi/z60sxfkd/

答案 1 :(得分:0)

尝试类似

的内容
<select id="SelectLocation" class="large" data-bind="value: G4.Model.Ticketing.StoreLocationSelected" onchange="window.location.href = 'Here get right url depending on value';" >
<option value="0" label="choose one"></option>
<option>1</option>
<option>1</option>
<option>1</option>
<option>1</option>
</select>

答案 2 :(得分:0)

使用此

   location.href="Your dropdown ITEM"   // Set this with your js function, onclick or whatever the way u want.

答案 3 :(得分:0)

这样的事情:

$("#SelectLocation").on("change", function(){
    document.location.href = $(this).val(); //assuming options have urls's in them
});

答案 4 :(得分:0)

不确定我是否正确地提出了您的问题。我想你想回发到服务器。如果要更改表单URL,则可以使用javascript / jquery,然后使用所有表单数据进行提交。

//by name
document.myform.action = url;

//by id
document.getElementById("form_id").action = url;
document.getElementById("form_id").submit();

//jquery
$("#form_id").attr("action", url);
$("#form_id")[0].submit();

您可以使用下拉选择索引更改事件来执行您的JS。

检查以下网址以获取更多信息: http://www.web-source.net/web_development/form_action.htm#.VEjMgyKUdDQ