根据选择的选项值撰写链接答案

【问题标题】：Compose a link based in select's option value根据选择的选项值撰写链接
【发布时间】：2012-08-01 11:55:41
【问题描述】：

我有 2 个下拉菜单，我需要用它的值组成一个链接。

代码如下：

<form id="dropdown1">
    <select id="linha">
        <option value="G12">Option 1</option>
        <option value="G11">Option 2</option>
        <option value="H89">Option 3</option>
    </select>
    <select id="dia">
        <option value="all">Every day</option>
        <option value="work">working days</option>
        <option value="sat">saturday</option>
        <option value="sun">sunday</option>
    </select>
</form>

我需要 JavaScript 中的一些东西来“组合”http://somewebsite.com/*selected_linha_value*/*selected_dia_value* 的链接

我该怎么做？

【问题讨论】：

标签： javascript html forms html-select

【解决方案1】：

    <select name="dia" id="dia">
      <option value="all">Every day</option>
      <option value="http://stackoverflow.com">working days</option>
      <option value="http://anotherSite.com">saturday</option>
      <option value="http://anotherSite2.com">sunday</option>
    </select>
    <script>
    $("#dia").change(function () {
              var selctedValue = "";
              $("select option:selected").each(function () {
                    selctedValue += $(this).val();
window.location.href = selctedValue;

    });
    });

【讨论】：

如果我必须为我拥有的每个选项都做的话，代码将是巨大的。第一次选择551个选项

【解决方案2】：

我想你需要这样的东西。

<script type="text/javascript">
params = getParams();
var name1 = unescape(params["linha"]);
switch(name1)
{
case "g12":
window.location = "http://www.google.com"
}

function getParams(){
var idx = document.URL.indexOf('?');

var params = new Array();
if (idx != -1) {
var pairs = document.URL.substring(idx+1, document.URL.length).split('&');
for (var i=0; i<pairs.length; i++){
nameVal = pairs[i].split('=');
params[nameVal[0]] = nameVal[1];
}
}
return params;
}

它不是完整的代码。它会给你一些想法。如果您有任何疑问，请发表评论

【讨论】：

这很好，但微笑的回答对我来说是完美的，因为我在第一个选择中有 551 个选项...谢谢
对不起，伙计。我只看到了你在代码下方提供的链接选项。无论如何，你得到了你的答案。数据全部

【解决方案3】：

看看：http://jsfiddle.net/ERHhA/

您可以使用jQuery val() 来获取选择框的值。然后只需将这些值附加到基本 url。

var url = "http://somewebsite.com/" + $('#linha').val() + "/" + $('#dia').val();

【讨论】：

太棒了！如果我想要一个按钮来打开组合链接而不是警报怎么办？
而不是 alert(url);我可以使用 open(url);谢谢！！
或者，window.location = url;。
不完全正确，它是：document.location.href = url;

【解决方案4】：

这个呢？

function make_url(){
    var linha = document.getElementById('linha').value;
    var dia = document.getElementById('dia').value;
    var url=window.location.href;
    var pos=url.indexOf('?');
    if (pos>-1){
        url = url.substr(0,pos);
    }
    //alert(url + '?linha='+linha+'&dia='+dia); return;
    document.location.href = url + '?linha='+linha+'&dia='+dia;
}

fiddle

【讨论】：

【解决方案5】：

HTML

<div class="container">
    <select class="small-nav">
    <option value="" selected="selected">Go To</option> 
    <option value="http://whiterabbitexpress.com">Services</option>
    <option value="http://shop.whiterabbitjapan.com">Shop</option>
</div><!-- container -->

JScript：

$(".small-nav").change(function() {
        window.location = $(this).find("option:selected").val();
    });

【讨论】：