有条件的下拉列表在IE中不起作用

Question

我在悬停时创建了一个过滤下拉菜单，通过从第一个下拉菜单中选择悬停时的国家名称，相应的目的地将出现在悬停的第二个下拉菜单中。但是它不能在Internet Explorer中工作，为什么也不能在边缘工作？

function changeddl(obj) {

 var text = obj.options[obj.selectedIndex].text;
 var ddl2 = document.querySelectorAll('#iOperation option');
for (var i = 1; i < ddl2.length; i++) {
var option = ddl2[i];
option.style.display = 'none';
if (text == 'Pick a Country') {
  if (['Pick a Destination'].indexOf(option.text) > -1)
    option.style.display = 'none'

}

if (text == 'India') {
  if (['Bangalore', 'Delhi', 'Pune','Gujarat','Rajastan','Goa','Haryana','Kerela','Hampi'].indexOf(option.text) > -1)
    option.style.display = 'block'

}
if (text == 'Sri Lanka') {
  if (['colombio','fetero','Kandy','Galle','Nuwara','Negombo'].indexOf(option.text) > -1)
    option.style.display = 'block'
}

if (text == 'Swedan') {
  if (['Swedan'].indexOf(option.text) > -1)
    option.style.display = 'block'
}
}
}

  function DropList() {
   var n = document.getElementById("iFunction").options.length;
  document.getElementById("iFunction").size = n;
  }

  function handleSelect(elm){
 window.location = elm.value;
 }



 var countryArrays = [ ['Bangalore', 'Delhi','Pune','Gujarat','Rajastan','Goa','Haryana','Kerela','Hampi'],
    ['colombio','fetero','Kandy','Galle','Nuwara','Negombo'],['Swedan'] ];

 function DropNew() {

 var index = document.getElementById("iFunction").selectedIndex - 1;

if (index >= 0){
document.getElementById("iOperation").size = countryArrays[index].length + 1;
} else {
jQuery("#popup").show();
 }
  }

 function hidePopup() {
jQuery("#popup").hide();
 }
    function handleSelect(elm){
 window.location = elm.value;

}