从多选-单击按钮时,它应该连接字符串并转到URL



当用户从下面的Select中选择选项并单击按钮时。。。这些值应该是连接的,并且应该转到特定的url!

例如如果用户选择product2&产品6&product8,然后单击按钮,值应该被连接起来并创建&转到该url,如example.com/268

<select id="one">
    <option value="default">Select Product</option>
    <option class="s" value="1">product1</option>
    <option class="q" value="2">product2</option>
    <option class="q" value="3">product3</option>
</select>
<select id="two">
    <option value="default">Select Version</option>
    <option class="l" value="4">product4</option>
    <option class="l" value="5">product5</option>
    <option class="c" value="6">product6</option>
</select>
<select id="three">
    <option value="default">Select OS</option>
    <option class="o" value="7">product7</option>
    <option class="o" value="8">product8</option>
    <option class="o" value="9">product9</option>
</select>

提前感谢!

下面是一个使用代码的工作示例:)

html:

<form id="myForm">
    <select id="one">
        <option value="default">Select Product</option>
        <option class="s" value="1">product1</option>
        <option class="q" value="2">product2</option>
        <option class="q" value="3">product3</option>
    </select>
    <select id="two">
        <option value="default">Select Version</option>
        <option class="l" value="4">product4</option>
        <option class="l" value="5">product5</option>
        <option class="c" value="6">product6</option>
    </select>
    <select id="three">
        <option value="default">Select OS</option>
        <option class="o" value="7">product7</option>
        <option class="o" value="8">product8</option>
        <option class="o" value="9">product9</option>
    </select>
        <input type="submit" value="Post" />
    </form>

javascript:

var myForm = document.getElementById("myForm");
myForm.addEventListener('submit', function(e) {
    e.preventDefault();
    var val1 = document.getElementById("one").value;
    var val2 = document.getElementById("two").value;
    var val3 = document.getElementById("three").value;
    if(val1 != "default" && val2 != "default" && val3 != "default")
        window.location.href = "http:www.example.com/" + val1 + val2 + val3;
    else
        alert("Fill out everything please!");
}, false);

还有一个JSFiddle,看看它在行动:

http://jsfiddle.net/KfH9m/1

最新更新