影响两个下拉列表的javascript

我有两个下拉列表，下面是代码，我的第二个下拉列表依赖于我的第一个下拉列表，所以当我从第一个下拉列表中选择时，它将根据我在第一个下拉列表中选择的内容在第二个下拉列表中显示选项。然后，当我从第二个下拉列表中选择一个选项时，它将调用一个php页面。但现在发生的事情是，当我从第一个下拉列表中选择一个选项时，页面刚刚刷新，没有提供从第二个下拉列表中选择的选项

<tr>
<td align="center"><select name="Ticket" id="Ticket">
<option value="" selected="selected">Please Select...</option>
<option value="Option1">Option1</option>
<option value="Option2">Option2</option>
</select></td>

<tr>
<td align="center"><select name="Category" size="1" id="Category">
<option value="" selected="selected">--</option>
<option value="Select1.php" class="Option1">Select1</option>
<option value="Select2.php" class="Option2">Select2</option>
</select><input type="submit" value="Go" id="submit"/></td>
</tr>

})

变化

$("#form1 select").change(function() {
    window.location = $("#form1 select option:selected").val();
})

到

---

这应该能奏效。只有当您单击“转到”按钮时，页面才会重定向

$(function () {
    $('#Ticket').change(function() {
        var optionClass = $(this).val();
        $('#Category option:not(:first)').hide();
        if (optionClass) {
            $('#Category').find('.' + optionClass).show();
        }
    });

    $('#submit').click(function () {
        window.location = $("#Category").val();
    });
});

如果要在选择第二个selectlist选项后立即重定向，请替换$'submit'。单击。。。。与

$(function() {
    $('#Ticket').change(function() {
        var optionClass = $(this).val();
        $('#Category option:not(:first)').hide();
        if (optionClass) {
            $('#Category').find('.' + optionClass).show();
        }
    });

    $('#Category').change(function() {
        var url = $(this).val();
        if (url) {
            window.location = url;
        }
    });
});

---

如果您添加的alertCategory已更改；在window.location行上方，当您在第一个下拉列表中选择某个内容时是否触发警报？我的猜测是否定的。您可能在其他地方有某个侦听器导致页面刷新。$Category.changefunction{window.location=$this.val；}这是我从原始帖子中得到的内容，这是我的页面刚刚刷新的地方…抱歉，但是，如果我在“选择”下有太多的选项，并希望它们都在自己的页面上重定向，这会起作用吗？不确定你的意思-使用你问题中的html，它会起作用。Select1将重定向到Select1.php，Select2将重定向到Select2.php，依此类推。如果需要更多选项，只需使用相同的模式添加它们。有道理？检查此JSFIDLE：

$(function () {
    $('#Ticket').change(function() {
        var optionClass = $(this).val();
        $('#Category option:not(:first)').hide();
        if (optionClass) {
            $('#Category').find('.' + optionClass).show();
        }
    });

    $('#submit').click(function () {
        window.location = $("#Category").val();
    });
});

$(function() {
    $('#Ticket').change(function() {
        var optionClass = $(this).val();
        $('#Category option:not(:first)').hide();
        if (optionClass) {
            $('#Category').find('.' + optionClass).show();
        }
    });

    $('#Category').change(function() {
        var url = $(this).val();
        if (url) {
            window.location = url;
        }
    });
});