Javascript 在列表中隐藏非活动或禁用的元素

我正在努力解决以下问题

在我的wordpress网站上，我有一个下拉过滤器列表

1。车辆类型（敞篷车、双门轿车等）

---

2。品牌（奔驰、宝马等）

---

3.型号（CLK、X5等）

---

因此，当从第一个列表中选择车辆类型时

在所选项目的第二个中显示相应的make

在第三个列表中，出现与品牌相关的车型（梅赛德斯CLK、宝马X5）

现在的问题是，禁用或不活动的品牌或型号不会显示在桌面上，但在移动设备上，它们会出现，尽管它们仍然不活动

第一个问题：如何从移动设备的列表中隐藏禁用的元素

第二个问题：我是否可以禁用品牌和型号，除非选择了车型

在下面，您可以看到列表的后端代码

var car_dealer = {};

（函数（$）{ /* *在提交时从空参数中清除表单URL */ $（'.vehicle search form'）。提交（函数（）{ $（this）.find（“input[type='number']”）。filter（函数（）{ return（$（this）.attr（'min'）=$（this）.attr（'value'）| |$（this）.attr（'max'）==$（this.attr（'value'））； }).attr（'disabled'，'disabled'）

}（jQuery））

---

我很感激，并期待尽快收到您的来信！

我知道这已经很旧了，但我们走吧

下面是事件处理程序-稍微修改了一点，使其只有一个选择事件处理程序

现在，就隐藏和显示而言，只需对适当的选项列表执行该操作，并按照您的指示过滤以隐藏禁用的选项。 使用

prop（“disabled”，true）

禁用，而不是属性

我遗漏了如何在需要时重新启用和显示，但这是一个简单的问题

.find（'option'）.prop（'disabled'，false）.show（）；

（函数（$）{
/**在提交时从空参数中清除表单URL*/
$（'.vehicle search form'）。在（'submit'，函数（e）上{
//可能要阻止提交？
e、 预防默认值（）；
$（this）.find（“输入[type='number']”）
.filter（函数（）{
返回（$（this.attr（'min'）==$（this.attr（'value'））||
$（this.attr（'max'）==$（this.attr（'value'））；
}).prop（'disabled'，true）；
$（this.find（“输入[type='search']））
.filter（函数（）{
return！$（this.val（）；
}).prop（'disabled'，true）；
$（this.find（“select”）.filter（函数（）{
return！（$（this.val（）&&&$（this.val（）！='-1'）；
}).prop（'disabled'，true）；
});
//在这里，我们可以创建一个自定义事件处理程序来执行禁用操作
$（“#汽车(经销商)场地(制造商)”）
.on（'change'，function（））{
var makeName=$（this）.find（'option:selected'）.data（'make'）；
$（this.trigger（“CustomSetMe”，[makeName，“fun]”）；
});
$（“#汽车#经销商(现场)车辆(类型)”）
.on（'change'，function（））{
让makeName=$（this）.find（'option:selected'）.data（'type'）；
$（this.trigger（“CustomSetMe”，[makeName，“fun]”）；
})
//将另一个添加到处理程序
.添加（“#汽车#经销商#场地#品牌”）
/*
*禁用所有不适合选定对象的选项
*/
.on（'custom-set-me'，函数（事件、比较、参数2）{）{
让我=$（这个）；
让options=iamMe.find（'option'）；
选择权
.prop（'disabled'，true）
//激活相应的模型
.filter（函数（）{
返回$（this）.data（'type'）==$.trim（compareTo）；
}).val（-1）.prop（'disabled'，false）；
//删除以前的值
iamMe.val（-1）；
options.filter（':diabled'）.hide（）；
});
}（jQuery））；

---

我知道这很旧，但我们走吧

下面是事件处理程序-稍微修改了一点，使其只有一个选择事件处理程序

现在，就隐藏和显示而言，只需对适当的选项列表执行该操作，并按照您的指示过滤以隐藏禁用的选项。 使用

prop（“disabled”，true）

禁用，而不是属性

我遗漏了如何在需要时重新启用和显示，但这是一个简单的问题

.find（'option'）.prop（'disabled'，false）.show（）；

（函数（$）{
/**在提交时从空参数中清除表单URL*/
$（'.vehicle search form'）。在（'submit'，函数（e）上{
//可能要阻止提交？
e、 预防默认值（）；
$（this）.find（“输入[type='number']”）
.filter（函数（）{
返回（$（this.attr（'min'）==$（this.attr（'value'））||
$（this.attr（'max'）==$（this.attr（'value'））；
}).prop（'disabled'，true）；
$（this.find（“输入[type='search']））
.filter（函数（）{
return！$（this.val（）；
}).prop（'disabled'，true）；
$（this.find（“select”）.filter（函数（）{
return！（$（this.val（）&&&$（this.val（）！='-1'）；
}).prop（'disabled'，true）；
});
//在这里，我们可以创建一个自定义事件处理程序来执行禁用操作
$（“#汽车(经销商)场地(制造商)”）
.on（'change'，function（））{
var makeName=$（this）.find（'option:selected'）.data（'make'）；
$（this.trigger（“CustomSetMe”，[makeName，“fun]”）；
});
$（“#汽车#经销商(现场)车辆(类型)”）
.on（'change'，function（））{
让makeName=$（this）.find（'option:selected'）.data（'type'）；
$（this.trigger（“CustomSetMe”，[makeName，“fun]”）；
})
//将另一个添加到处理程序
.添加（“#汽车#经销商#场地#品牌”）
/*
*禁用所有不适合选定对象的选项
*/
.on（'custom-set-me'，函数（事件、比较、参数2）{）{
让我=$（这个）；
让options=iamMe.find（'option'）；
选择权
.prop（'disabled'，true）
//激活相应的模型
.filter（函数（）{
返回$（this）.data（'type'）==$.trim（compareTo）；
}).val（-1）.prop（'disabled'，false）；
    $(this).find( "input[type='search']" ).filter(function(){
        return ! $(this).val();
    }).attr( 'disabled', 'disabled' );

    $(this).find( "select" ).filter(function(){
        return ! ( $(this).val() && $(this).val() != '-1');
    }).attr( 'disabled', 'disabled' );


})

/*
 * Disables all models that do not fit the selected make
 */
$('#car_dealer_field_vehicle_type').on('change',function(){
    var makeName = $(this).find( 'option:selected' ).attr( 'data-type' );

    $('#car_dealer_field_make option')
    // first, disable all options
    .attr( 'disabled', 'disabled' )
    // activate the corresponding models
    .filter( '[data-type="' + $.trim( makeName ) + '"], [value="-1"]' ).removeAttr( 'disabled' )
    // remove previous value
    .parent().val( -1 );
});
$('#car_dealer_field_make').on('change',function(){
    var makeName = $(this).find( 'option:selected' ).attr( 'data-make' );

    $('#car_dealer_field_model option')
    // first, disable all options
    .attr( 'disabled', 'disabled' )
    // activate the corresponding models
    .filter( '[data-make="' + $.trim( makeName ) + '"], [value="-1"]' ).removeAttr( 'disabled' )
    // remove previous value
    .parent().val( -1 );
});