jQuery的隐藏/显示不是在IE

Question

工作，我有一组单选按钮和一个div的。当页面加载时，我不希望div可见，并且当选择按钮1-3时，我想要div显示。当选择按钮4或5时，我不想显示div。

我现在有它在所有的浏览器正在与IE（惊喜）的除外。我似乎无法弄清楚发生了什么问题。我用萤火虫，没有错误。下面是我有：

HTML： -the按钮

<input type="radio" name="bWaitTime" value="1" id="group_name_0"/> 
    &nbsp;&nbsp; 
<input type="radio" name="bWaitTime" value="2" id="group_name_1"/> 
    &nbsp;&nbsp; 
<input name="bWaitTime" type="radio" value="3" id="group_name_2"/> 
    &nbsp;&nbsp; 
<input type="radio" name="bWaitTime" value="4" id="group_name_3"/> 
    &nbsp;&nbsp; 
<input type="radio" name="bWaitTime" value="5" id="group_name_4"/> 

-the div来隐藏

<div id="yes_box"> 
<!--Content Here --> 
</div> 

，这里是脚本我有，这是目前居住在div＃里面yes_box

 <script type="text/javascript"> 

      window.onload = $(function(){ 
           var myDiv = $("#yes_box"); 
           myDiv.hide(); 
          }); 

      $(function(){ 

      var myDiv = $("#yes_box"); 

       $("input#group_name_0").change(function(){ 
        myDiv.show('slow'); 
       }); 
       $("input#group_name_1").change(function(){ 
        myDiv.show('slow'); 
       }); 
       $("input#group_name_2").change(function(){ 
        myDiv.show('slow'); 
       }); 
       $("input#group_name_3").change(function(){ 
        myDiv.hide('slow'); 
       }); 
       $("input#group_name_4").change(function(){ 
        myDiv.hide('slow'); 
       }); 

      }); 

      </script> 

我见过这种在别处使用的确切方法，它没有p然而，在IE浏览器中使用IE浏览器并不能正常工作。 IE完全忽略它。

Answer 1

更好地利用jQuery的。就绪（）方法，而不是的window.onload

 $(document).ready(function() { 
      var myDiv = $("#yes_box"); 
      myDiv.hide(); 

      $("input#group_name_0").change(function(){ 
       myDiv.show('slow'); 
      }); 
      $("input#group_name_1").change(function(){ 
       myDiv.show('slow'); 
      }); 
      $("input#group_name_2").change(function(){ 
       myDiv.show('slow'); 
      }); 
      $("input#group_name_3").change(function(){ 
       myDiv.hide('slow'); 
      }); 
      $("input#group_name_4").change(function(){ 
       myDiv.hide('slow'); 
      }); 

     }); 

编辑：

此外，您可以替换所有。变化（）事件与一个单一的一个，如果所有的ID匹配“group_name_n”模式：

 $("input[id^=group_name_]").change(function(){ 
      myDiv.show('slow'); 
     }); 

Answer 2

认为这个问题是在这里这条线

window.onload = $(function() { 

应该是

$(window).load(function() { 

它可能不是解决问题的帮助。您可以将您的事件处理程序，以一个单一的处理器..

而且请使用$(window).load()或DOM Ready ..都是没有必要在这里

隐藏它最初使用CSS

​#yes_box 
{ 
    display: none; 
    width: 200px; 
    height: 100px; 
    background-color: orange; 
}​ 

的Javascript

$(window).load(function() { 
    var myDiv = $("#yes_box"); 
    myDiv.hide(); 

    $("input[type='radio']").change(function() { 
     var val = this.value; 
     if (val == 1 || val == 2 || val == 3) { 
      myDiv.show('slow'); 
     } 
     else { 
      myDiv.hide('slow'); 
     } 
    }); 
});​ 

Check Fiddle

Answer 3

简化代码是（因为你的代码工作正常IE7,8,9我的系统上 ）

<script type="text/javascript"> 
    $(function(){ 

     var myDiv = $("#yes_box").hide(); 

     $('input[name="bWaitTime"]').change(function(){ 
      var value = parseInt(this.value,10); 
      if (value>=1 && value <=3){ 
       myDiv.show('slow'); 
      } else { 
       myDiv.hide('slow'); 
      } 
     }); 
    }); 
    </script> 

Answer 4

问题是你传递一个jQuery对象window.onload，这需要一个功能，如

window.onload = function(){ 
    var myDiv = $("#yes_box"); 
    myDiv.hide(); 
}; 

如果你想要一个页面加载时隐藏的元素不会更好的做到这一点与CSS，或者当DOM准备好在窗口加载之前触发。