Question

我希望在html中制作一系列选择框，根据已经选择的内容显示不同的选项。我可以让前两个工作，但无法解决为什么它没有注入到这里的最后一个方框，＃FCadultseats选择框。

我基本上希望FCadultseats框只有在电影放在大电影院时（晚上9点）才可用。

非常感谢任何帮助。我已经尝试了很多年，不知道为什么这不会工作。

这是我的代码：

<form id = "booking" method = "POST" action = "testserver">
                    Day: 
                    <select id = "dayselector" name = "day">
                        <option disabled selected> -- Select a Day -- </option> 
                        <option value= "Monday">Monday </option>
                        <option value = "Tuesday">Tuesday</option>
                        <option value = "Wednesday">Wednesday</option>
                        <option value = "Thursday">Thursday</option>
                        <option value = "Friday">Friday</option>
                        <option value = "Saturday">Saturday</option>
                        <option value = "Sunday">Sunday</option>
                    </select>   
                    <br>
                    Time and Cinema: 
                    <select id ="timeselector" name ="time">
                        <option disabled selected> -- Select a Time -- </option>
                    </select> 
                    First Class Adults: <select id ="FCadultseats">
                        <option disabled selected> -- Not Available -- </option>
                    </select>
</form>



$(document).ready(function(){
$("#dayselector").change(function(){
    var sel_day = $('option:selected').val();
    if (sel_day == "Saturday" || sel_day == "Sunday"){
        $("select#timeselector").html('<option disabled selected> -- Select a Time -- </option><option value ="9">9pm - Large Cinema</option><option value ="4">4pm - Small Cinema</option>'); 
    } else {    
        $("select#timeselector").html('<option disabled selected> -- Select a Time -- </option><option value ="9">9pm - Large Cinema</option>');
    }
});             

$("#timeselector").change(function(){
    var sel_time = $('option:selected').val();
    if (sel_time == 9){
    $("#FCadultseats").html('<option value ="0">0</option><option value ="1"></option><option value ="2">2</option><option value ="3">3</option><option value ="4">4</option><option value ="5">5</option><option value ="6">6</option><option value ="7">7</option><option value ="8">8</option><option value ="9">9</option><option value ="10">10</option><option value ="11">11</option><option value ="12">12</option>');
    }
});

}）;

Answer 1

尝试更改

var sel_day = $('option:selected').val();

到

var sel_day = this.value;

并在两个地方都这样做。

$('option:selected')为每个选择选择页面上所有选定的选项。

多个相关选择框不起作用

1 个答案: