功能不會爲選擇選項IE7

Question

我在IE7的一個問題。 gen函數不會爲選擇生成任何選項。 有此選擇

<select id="year_individ" name="age" onclick="showCategory();"> 
    <option></option> 
    </select> 

，我產生年（從1942年至1994年）是這樣的：

$(document).ready(function() { 
     var myselect=document.getElementById("year_individ"), 
       year = new Date(1995); 
     var gen = function(max){ 
      do { 
       year--; 
       myselect.add(new Option(year,max),null); 
       max++;   
      } while(max<71); 
     }(18); 
}); 


     function showCategory() { 
      if ($('.gender').is(':checked')) { 
       if ($('#year_individ').val() >= 18) { 
        if ($('#female').is(':checked')) { 
         $('#category').html('Women ');    
        } else { 
         $('#category').html('Men ');             
        } 
        age = parseInt($('#year_individ').val()); 
        if (age < 40) $('#category').append('18-39 yrs'); 
         else if (age < 50) $('#category').append('40-49 yrs'); 
         else $('#category').append('50 and more '); 
       }   
       else 
        $('#category').html('set gender and year'); 
      }    
     } 

它應該改變類型，當我點擊選擇。 （還需要檢查「性別」廣播）。 我使用jQuery 1.5.1分鐘。它適用於Chrome，Firefox和Opera。 這裏的代碼（它實際上並沒有在工作的jsfiddle）http://jsfiddle.net/5DvHj/2/

謝謝

Answer 1

爲什麼要使用內聯函數？ 你應該使用jQuery添加選項：

$(document).ready(function() { 
    var myselect=$('#year_individ'), year = new Date(1995); 
    var gen = function(max){ 
    do { 
     myselect.append($('<option></option>').val(max++).html(--year));   
    } while(max<71); 
    }(18); 
}); 

Answer 2

它在myselect.add()第二個參數，即使它是null，IE7還是不喜歡它。

看到這個post：

Answer 3

我沒有一個IE瀏覽器，但我用即時功能，以這樣的方式

(function(max){ 
    // ... 
}(18)); 

可能是這裏的問題？

Answer 4

獲取有關

 myselect.add(new Option(year,max),""); 

這個工程類型不匹配。我修正了點擊的問題（刪除了內嵌的onclick事件

這是代碼儘可能少地改變你的代碼，另一篇文章緩存了一些jQuery對象，這根本不是一個壞主意......

DEMO

$(document).ready(function() { 
    var myselect=document.getElementById("year_individ"), 
    year = new Date(1995); 
    var gen = function(max){ 
     do { 
     year--; 
     try { 
      myselect.add(new Option(year,max),""); 
     } 
     catch(e) { 
      myselect.add(new Option(year,max)) 
     } 
     max++;    
     } while(max<71); 
    }(18); 


    $('#year_individ, .gender').click(function() { 
    var age = $('#year_individ').val();  
    if ($('.gender').is(':checked')) { 
     if (age >= 18) { 
     if ($('#female').is(':checked')) { 
      $('#category').html('Women ');     
     } else { 
      $('#category').html('Men ');              
     } 
     if (age < 40) $('#category').append('18-39 yrs'); 
     else if (age < 50) $('#category').append('40-49 yrs'); 
     else $('#category').append('50 and more ');  
     }   
     else $('#category').html('set gender and year'); 
    }    
    }); 
}); 

Answer 5

你的直列onclick屬性的問題。用jQuery代替它，就像$('span.gender, #year_individ').click(showCategory);

Answer 6

爲了獲得良好的跨瀏覽器的可靠性，嘗試的jQuery做的一切。

Conisder這樣的：

HTML：

<select id="year_individ" name="age"></select> 

的javascript：

$(document).ready(function() { 
    var $category = $('#category'), $female = $('#female');//cache jQuery objects to avoid need for rediscovery 
    var $year_individ = $("#year_individ").on('change', function(){//onchange event, not onclick 
     var $this = $(this); 
     if ($("input.gender:checked").val()) {//probably 
      var age = parseInt($this.val()); 
      if (age >= 18) { 
       $category.html($female.is(':checked') ? 'Women ' : 'Men '); 
       if (age < 40) $category.append('18-39 yrs'); 
       else if (age < 50) $category.append('40-49 yrs'); 
       else $category.append('50 yrs and more'); 
      } 
      else { 
        $category.html('set gender and year'); 
      } 
     } 
    }); 
    for(var year=new Date().getYear()-18,age=18; year<=1942; year--,age++) { 
     $year_individ.append($('<option />').attr('value',age).html(year)); 
    } 
});