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準備好在窗口加載之前觸發。