如何更改基于第一个下拉选择的第二个下拉值 - How to change second drop-down value based first drop-down selection?

How to change second drop-down value based first drop-down selection?

我有两个下拉列表，即Min Price和Max Price，我想根据第一个选择更改第二个下拉值。

举个例子1st drop-down selection is 100 means, 2nd drop-down value should be greater than the 100, if it is 200 in 1st, value of 2nd should be greater than 200

有关于jQuery或js的想法吗？

我能想到的最简单的（这可以让你回到你的选择，你可以选择400，然后选择200，一切都可以）

<select id='min'>
<option value='100'>100</option>
<option value='200'>200</option>
<option value='300'>300</option>
<option value='400'>400</option>
</select>
<select id='max'>
<option value='100'>100</option>
<option value='200'>200</option>
<option value='300'>300</option>
<option value='400'>400</option>
</select>
var removed;
$('#min').change( function() {
    var value = this.value;
    $('#max').prepend(removed);
    var toKeep = $('#max option').filter( function( ) {
        return parseInt(this.value, 10) >= parseInt( value, 10);
    } );
    removed =  $('#max option').filter( function( ) {
        return parseInt(this.value, 10) < parseInt( value, 10);
    } );
    $('#max').html(toKeep);
});

http://jsfiddle.net/NjLNF/2/

EDIt-根据注释添加parseInt（）

您可以使用jquery和change函数。如果第一个下拉列表的id是drop1，则它将是$（"#drop1"）.change（function（）｛..将您的函数放在此处以填充第二个下拉列表。.

$('#first_dd').change(function(){
var dd_val=$(this).val();
var options = "";
$('#second_dd').html('');
for(var i=parseInt(dd_val+1);i<=END-LIMIT;i++)
{
$('#second_dd').append('<option value='+i+'>'+i+'</option>');
}
});

我还没有在浏览器中测试它。考虑系统，只需遵循逻辑即可。

$(function () {
        $("#one").change(function (e) {
            $("#two").empty();
            var options =
            $("#one option").filter(function(e){
                return $(this).attr("value") > $("#one option:selected").val();
            }).clone();
            $("#two").append(options);
        });
    });

在"最低价格"下拉列表中添加一个侦听器，然后循环查看"最高价格"下拉菜单的值，直到找到一个大于所选"最低价格》下拉列表的值。像这样的

$('#minPrice').change(function(){
    var minVal = $('#minPrice option:selected').val();
     $('#maxPrice option').each(function(){
          if(minVal < $(this).val()){
             $(this).attr('selected', 'selected');
             return false;
          }
     });
});