Функция не генерирует опции для выбора в 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

Для хорошей межбраузерной надежности попробуйте все сделать в jQuery.

Обдумайте это:

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));
    }
});

Answer 3

Получение несоответствия типов на

      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 4

Ваш встроенный атрибут onclick является проблемой. Замените его на jQuery, например $('span.gender, #year_individ').click(showCategory);

Answer 5

У меня нет IE, но я использую непосредственные функции следующим образом:

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

Возможно, в этом проблема?

Answer 6

Это второй аргумент в myselect.add(), хотя он null, IE7 по-прежнему не нравится.

См. post :