Question

我在网页上生成了一些JS代码，用于计算根据闰年和月份在表单的日期下拉框中显示的正确天数。不幸的是，我注意到在IE9标准文档模式下，下拉列表似乎没有显示日期编号（例如1到31）。 IE 10，Firefox v.25.0.1和Google Chrome v.31.0.1650.63正确显示下拉列表中的数字。我想我有一些旧文档模式不支持的代码，但似乎无法找到它的位置。我希望有人能够发现我的错误？我在下面列出了相关代码。请注意，我正在使用HTML5！DOCTYPE运行文档。

JS功能：

<script>
    function is_leap(direction)
    {
        if(direction=="from")
            var year=document.getElementById("f_year").value;
        else if(direction=="to")
            var year=document.getElementById("t_year").value;
        var a = 2000;
        for(a;a<year;a+=4)
        {
        }

        if(a==year)
        {
      return true;
        }
  else return false;
    }

    function out_days(v,direction)
    {
        var html = "";
        for(var x=1;x<=v;x++)
  {
            html += '<option value="' + x + '">' + x + '</option>';
  }
        if(direction=="from")
  {
            var temp_day=document.getElementById("f_day").selectedIndex;
      document.getElementById("f_day").innerHTML=html;  
      document.getElementById("f_day").selectedIndex=temp_day;
  } 
  else if(direction=="to")
  {
      var temp_day=document.getElementById("t_day").selectedIndex;  
            document.getElementById("t_day").innerHTML=html;
      document.getElementById("t_day").selectedIndex=temp_day;
  } 
    }

    function chk_mon(direction)
    {
        if(direction=="from")
      var e = document.getElementById("f_month").selectedIndex;
  else if(direction=="to")
            var e = document.getElementById("t_month").selectedIndex;
        switch(e)
  { 
      case 0: case 2: case 4: case 6: case 7: case 9: case 11:
            {                   
          out_days(31,direction);
    break;
            }
      case 1:
      {
                if(is_leap(direction))
          {
        out_days(29,direction);
          }
          else out_days(28,direction);
    break;
      }
      case 3: case 5: case 8: case 10:
      {
          out_days(30,direction);
    break;
      }
      default:
      {
          out_days(31,direction);
    break;
      }
        }
    }
</script>

HTML调用代码/函数：

<div class="field"><div class="label">From:</div><select onchange="chk_mon('from')" id="f_month" name="from_month">
<option value="1">January</option>
<option value="2">February</option>
<option value="3">March</option>
<option value="4">April</option>
<option value="5">May</option>
<option value="6">June</option>
<option value="7">July</option>
<option value="8">August</option>
<option value="9">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select>
<select id="f_day" name="from_day">
    <script>
        chk_mon("from");
    </script>
</select>
<select onchange="chk_mon('from')" id="f_year" name="from_year">
    <option value="2013">2013</option>
    <option value="2014">2014</option>
    <option value="2015">2015</option>
    <option value="2016">2016</option>
    <option value="2017">2017</option>
    <option value="2018">2018</option>
    <option value="2019">2019</option>
    <option value="2020">2020</option>
    <option value="2021">2021</option>
    <option value="2022">2022</option>
    <option value="2023">2023</option>
    <option value="2024">2024</option>
    <option value="2025">2025</option>
    <option value="2026">2026</option>
    <option value="2027">2027</option>
    <option value="2028">2028</option>
    <option value="2029">2029</option>
    <option value="2030">2030</option>
</select></div>

Answer 1

在您的脚本中，分配innerHTML SELECT元素：

 document.getElementById("f_day").innerHTML=html;

哪些在IE9中无法正常工作（SELECT s的错误）。更多信息here。

这是jsfiddle可能的解决方法：我在SELECT中包裹了一天SPAN并设置了此innerHTML的{{1}}而不是SPAN脚本。

IE9标准文档模式打破了JavaScript

1 个答案: