Question

你知道为什么这个简单的javascript无效吗？它正在努力 Firefox，Chrome不在IE Safari和Opera中工作。你能帮助我吗？似乎document.getElementById在IE，Safari和Opera中有一些问题。为什么呢？

   <form name="formular" action="test.php">
      <select id="testMenu" name="testMenu" onChange="testOptions()">
        <option id="X2" value="2">2</option>
        <option id="X3" value="3" selected>3</option>
        <option id="X4" value="4">4</option>                        
      </select>     

      <select id="nextMenu" name="nextMenu">
        <option id="B1" value="1">B1</option>
        <option id="B2" value="2">B2</option>
      </select>
   </form>
     <script type="text/javascript">
       var choose_option =3;

       function testOptions() {
       var choose_option = document.getElementById("testMenu").selectedIndex+2;

       if (choose_option == 4){
          document.getElementById("B2").style.display="none";
        }else{
          document.getElementById("B2").style.display="block";  
        }
    }   
    </script>

Answer 1

为什么你认为getElementById具体不起作用？问题更多的是无法将display: none应用于<option>元素。最简单的修复可能是为它设置disabled：

document.getElementById("B2").disabled = choose_option === 4;

如果您希望它真的消失，可以通过删除它来完成：

var nextMenu = document.getElementById("nextMenu");
var b2 = document.getElementById("B2");

function testOptions() {
    var choose_option = document.getElementById("testMenu").selectedIndex + 2;

    if (choose_option === 4) {
        if (b2.parentNode) {
            b2.parentNode.removeChild(b2);
        }
    } else if (!b2.parentNode) {
        nextMenu.appendChild(b2);
    }
}

javascript document.getElementById不起作用

1 个答案: