0

ドロップダウン1が変更されたときにドロップダウン2の値の制限を変更することは可能ですか?これが私のコードです

<!--DROPDOWN 1-->
<p class="">From</p>
<select name="From" id="From" onChange="displayVal(this)">
<option value="any">Any</option>
<option value="none">None</option>
<option value="10000">&pound;10,000</option>
<option value="20000">&pound;20,000</option>
<option value="30000">&pound;30,000</option>
<option value="40000">&pound;40,000</option>
<option value="50000">&pound;50,000</option>
<option value="60000">&pound;60,000</option>
<option value="70000">&pound;70,000</option>
<option value="80000">&pound;80,000</option>
<option value="90000">&pound;90,000</option>
<option value="100000">&pound;100,000</option>
<option value="110000">&pound;110,000</option>
<option value="120000">&pound;120,000</option>
<option value="130000">&pound;130,000</option>
<option value="140000">&pound;140,000</option>
<option value="150000">&pound;150,000</option>
<option value="150001">&pound;150,000+</option>
</select>

<!--DROPDOWN 2-->
<p class="">To</p>
<select name="To" id="To">
<option value="any">Any</option>
<option value="none">None</option>
<option value="10000">&pound;10,000</option>
<option value="20000">&pound;20,000</option>
<option value="30000">&pound;30,000</option>
<option value="40000">&pound;40,000</option>
<option value="50000">&pound;50,000</option>
<option value="60000">&pound;60,000</option>
<option value="70000">&pound;70,000</option>
<option value="80000">&pound;80,000</option>
<option value="90000">&pound;90,000</option>
<option value="100000">&pound;100,000</option>
<option value="110000">&pound;110,000</option>
<option value="120000">&pound;120,000</option>
<option value="130000">&pound;130,000</option>
<option value="140000">&pound;140,000</option>
<option value="150000">&pound;150,000</option>
<option value="150001">&pound;150,000+</option>
</select>

dropdown1をdropdown2に変更するとnone、オプションは表示されるだけで、それ以上は表示noneされません。また、dropdown1の値をある金額に変更した場合、たとえば、dropdown2には、オプションを含む30000値よりも大きい値のみが表示されます。javascriptまたはjQueryでこれを行う方法はありますか?ごめん。javascriptとjQueryは初めてです。よろしくお願いします。30000any

4

3 に答える 3

4

デモ: http: //jsfiddle.net/LsaLA/1/

コード

function setTo() {
    var f = $('#From').val();
    var t = $('#To');
    t.children().hide();
    if( f == 'none' ) {
        t.children('[value="none"]').show();
        t.val('none');
    }
    else if( t == 'any' ) {
        t.children().show();
        t.val('any');
    }
    else {
        f = parseInt(f, 10);
        t.children().each(function() {
            if( $(this).val() == 'any' ) {
                $(this).show();
                t.val('any');
            }
            else {
                var v = parseInt($(this).val(), 10);
                if(!isNaN(v) && v >= f) {
                    $(this).show();
                }
            }
        });
        t.val('any');
    }
}

$('#From').change(setTo);


//call it on load as well
setTo();
于 2012-09-22T06:18:44.110 に答える
2

これを試してください:http://jsfiddle.net/F6xnL/4/

$("#From").change(function() {
$("#To").attr("disabled", false).children().each(function() {
    $(this).attr('disabled', false);
});

if ($(this).val() === 'any') return;
if ($(this).val() === 'none') {
    $("#To").val("none").attr("disabled", true);
    return;
}

var pound = parseInt($(this).val());
$("#To").children().each(function() {
    var val = $(this).val();
    if (val === 'none' || val === 'any') {
        $(this).attr('disabled', true); return;
    }
    if (parseInt($(this).val()) <= pound) {
        $(this).attr('disabled', true);
    }
});
});​
于 2012-09-22T06:23:06.483 に答える
1
$('#From').change(function(){
    if($(this).val() == 'none'){
        $('#To').prop('disabled', true);
    }else if((true == $('#To').prop('disabled')) && ($(this).val() != 'none')){
       $('#To').prop('disabled', false);          
    }
    $('#To option').each(function(){
        if($(this).val() < $('#From').val()){
            $(this).hide(0);
        }else{
            if($(this).css('display') == 'none'){
                $(this).show(0);   
           }
        }            
    });
});

テストされていませんが、これは機能するはずです。私は少し冗長です。

于 2012-09-22T06:13:58.857 に答える