选择多选项时打开页面

Question

我在HTML中有多个选择框，我需要验证选择的选项，然后打开一个新页面，将我带到老师的个人资料和所选学校的页面，我需要为每个可能的答案创建一个页面。

选择与学校一起学习的老师

<select id="school">
    <option value="Once" selected="">One</option>
    <option value="Twice">Two</option>
    <option value="Three">Three</option>
    <option value="Four">Four</option>
</select>

<select id="teacher">
    <option value="Once" selected="">Sam</option>
    <option value="Twice">Micheal</option>
    <option value="Three">Manny</option>
    <option value="Four">Jenny</option>
</select>

Answer 1

与jQuery一起使用

$(function() {
    $('#school, #teacher').change(function() {
        //You can validate here if you want
        var myWindow = window.open("http://yourserver.com/myapp/" + $("#school").val() + "/" + $("#teacher").val(), "MsgWindow", "width=800, height=600");
    });
});

Answer 2

添加onchnge事件HTML：

 <select id="school">
<option value="Once" selected=""  onchange="toggle();">One</option>
                        <option value="Twice">Two</option>
                        <option value="Three">Three</option>
                        <option value="Four">Four</option>
                    </select>

 <select id="teacher">
<option value="Once" selected=""  onchange="toggle();">Sam</option>
                        <option value="Twice">Micheal</option>
                        <option value="Three">Manny</option>
                        <option value="Four">Jenny</option>
                    </select>

JS：

 function toggle(){
            // to do : your logic goes here 
            // redirect to new page 

        }

Answer 3

您可以使用更好的方法

var url = "http://yourserver.com/myapp/";
$(function() {
    $('#school, #teacher').on("change",function() {
        window.open( url + $("#school").val() + "/" + $("#teacher").val());
    });
});