2

我有 2 个选择，我想根据第二个选择的值删除第一个选择的值。例如：如果我从第二个选择中选择值 1 和 2，我希望隐藏值 2,3,4,5，如果在第二个选择中值为 3，我希望隐藏值 1,2,3：

选择1：

<select name="select1">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>

选择2：

<select name="select2">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

这是在选择 1 或 2 的情况下隐藏的代码：

var ary=[2,3,4,5];
$('[name=select1] option').filter(function(){
return ($.inArray(parseInt(this.value),ary) >-1);}).hide();

此代码适用于隐藏，但我有一个问题。当代码在值 1 和 2 上隐藏 2、3、4、5 时，在第二次选择中选择值 3 只显示值 1，因为其他值是隐藏的。我使用 show() 解决了这个问题。然后显示 2,3,4,5 但我无法隐藏值 1 因为 return :// 我试过这个，它不会工作：

var ary=[4,5];
var ary2=[1];
$('[name=select1] option').filter(function(){
return ($.inArray(parseInt(this.value),ary) >-1);}).hide()&&($.inArray(parseInt(this.value),arry2) >-1);}).show();

我还尝试调用另一个总是刷新 select1 的函数，显示它所有的值，并且在这个函数中只使用隐藏，我认为这是正确的方法，但我不知道如何解决它？

4

1 回答 1

1

在这里摆弄这个：http: //jsfiddle.net/8ZuGE/

请注意，我想在这里添加列表项可能会更有效率，但你明白了：

var $resetValues = $('#select1').find("option");

$('#select2').on('change', function() {
    var selected = $("option:selected", this).val();
    // Reset select1
    $('#select1').empty();
    $resetValues.each(function() {
         $('#select1').append($(this));
    });

    var array; // Hidden values
    if(selected > 0 && selected < 3) {
        array = [2,3,4,5];
    } else {
        array = [1,2,3];
    }

    $('#select1 option').filter(function() {
        return ($.inArray(parseInt($(this).val()), array) != -1);
    }).remove();
});
于 2013-04-18T15:39:28.940 回答