如何禁用所有选项第二个选择框，该选项可以小于第一个选择框已选择选项

Question

我需要在特定年份之间获取日期，所以我放了两个下拉菜单"从年份"和"到年份"，但我想验证"到下拉"值必须大于"表单下拉列表"

下面是我的 html 代码

<div class="graph-filter">
<label>From</label>
<select onchange="change_data_year();" id="from_data_year" name="from_data_year" class="graph-select">
    <option selected="" value="2016">2016</option>
    <option value="2015">2015</option>
    <option value="2014">2014</option>
    <option value="2013">2013</option>                                                                  
</select>
<label>To</label>
<select id="to_data_year" name="to_data_year" class="graph-select">
    <option selected="" value="2016">2016</option>
    <option value="2015">2015</option>
    <option value="2014">2014</option>
    <option value="2013">2013</option>                                                                  
</select> 
<input type="submit" value="Submit">  

Answer 1

像这样尝试

 function change_data_year(){
    $('#to_data_year option').prop('disabled',false);
    var from_data_year=$('#from_data_year').val();
    var to_data_year=$('#to_data_year').val();
    $('#to_data_year option').filter(function() {
        return $(this).val() < from_data_year;
     }).prop('disabled', true);
 } 

我希望这就像你需要它一样。