jquery 代码不适用于 Internet Explorer - 基于另一个选择框的选择框选项答案

【问题标题】：jquery code not working with internet explorer - select box option based on another select boxjquery 代码不适用于 Internet Explorer - 基于另一个选择框的选择框选项
【发布时间】：2015-08-25 06:43:58
【问题描述】：

我有一个 jquery 脚本，用于根据另一个选择框显示/隐藏值，虽然它适用于 Firefox 和 Chrome，但它不适用于 IE

var otherselectoption = $('#select1,#select2,#select3').find('option').filter(function(){
  return $(this).attr('value') != "";
});
 $('#selectlist').change(function(){
   var selected = $(this).val();
   otherselectoption.hide().filter(function(){
     return $(this).attr('value').indexOf(selected) > -1;
   }).show();
 });

演示链接：http://jsfiddle.net/8g13wc5g/

另外，我希望这样每次我选择“---Filter---”选项时，底部 3 个选择框的其余部分都会重置为默认值，以便为空白并提供全套选项。

【问题讨论】：

那个小提琴在 Chrome 中对我不起作用
你可以使用这个技巧 - stackoverflow.com/a/5414366;但我建议不要这样做。这将是矫枉过正。坚持禁用 IE 的选项，如我上一个答案所示 - stackoverflow.com/a/32184116/1355315
@Abhitalks，实际上我使用了您提到的技巧并对其进行了一些定制，并且效果非常好-这是我的版本fiddle.jshell.net/u83t19kc

标签： javascript jquery

【解决方案1】：

你不能在 IE 中做到这一点。如果是 IE，您可以禁用/启用选项而不是隐藏/显示。其他解决方案是添加/删除选项而不是显示/隐藏。但这在启用/禁用选项解决方案中是不可行的。

你的问题的第二部分你可以添加 prop('selected', true) 来设置相关选项被选中

var otherselectoption = $('#select1,#select2,#select3').find('option');
$('#selectlist').change(function(){
  var selected = $(this).val();
  otherselectoption.prop('disabled', true);
  otherselectoption.filter(function(){
    return ($(this).attr('value').indexOf(selected) > -1 ||$(this).attr('value') == "")
 }).prop({'disabled': false});
}).change();

【讨论】：