Question

我有三个选择菜单，这些菜单会发布到函数中以通过Ajax获取金额。

问题是，在所有浏览器中都会显示“选择菜单”，但在Internet Explorer 8中只显示“年份选择菜单”。

以下是Javascript：

    <!--START CALENDAR DROPDOWN-->

        <script type='text/javascript'>//<![CDATA[ 

        (function() {

            var currentDate = new Date();

            var calendar = [
                ["January", 31],
                ["February", 28],
                ["March", 31],
                ["April", 30],
                ["May", 31],
                ["June", 30],
                ["July", 31],
                ["August", 31],
                ["September", 30],
                ["October", 31],
                ["November", 30],
                ["December", 31]
                ],
                cont = document.getElementById('calendar-container');
            // setup
            var sel_year = document.createElement('select'),
                sel_month = document.createElement('select'),
                sel_day = document.createElement('select');

                sel_year.setAttribute("id", "year2Sel");
                sel_month.setAttribute("id", "monthSel");
                sel_day.setAttribute("id", "daySel");

                sel_year.setAttribute("name", "year2Sel");
                sel_month.setAttribute("name", "monthSel");
                sel_day.setAttribute("name", "daySel");

                sel_year.setAttribute("onchange", "showRSS(document.getElementById('field2').value");
                sel_month.setAttribute("onclick", "showRSS(document.getElementById('field2').value, document.getElementById('yearSel').value, this.value, document.getElementById('daySel').value )");
                sel_day.setAttribute("onchange", "showRSS(document.getElementById('field2').value, document.getElementById('yearSel').value, document.getElementById('monthSel').value, this.value )");


            function createOption(txt, val, selected) {
                var option = document.createElement('option');
                option.value = val;
                option.selected = selected;
                option.appendChild(document.createTextNode(txt));
                return option;
            }

            function clearChildren(ele) {
                while (ele.hasChildNodes()) {
                    ele.removeChild(ele.lastChild);
                }
            }

            function recalculateDays() {
                var month_index = sel_month.value,
                    df = document.createDocumentFragment();
                for (var i = 1, l = calendar[month_index][1]; i <= l; i++) {
                    var selected = (currentDate.getDate() === i) ? true : false;
                    df.appendChild(createOption(i, i, selected));
                }
                clearChildren(sel_day);
                sel_day.appendChild(df);
            }

            function generateMonths() {
                var df = document.createDocumentFragment();
                calendar.forEach(function(info, i) {
                    var selected = (currentDate.getMonth() === i) ? true : false;
                    df.appendChild(createOption(info[0], i, selected));
                });
                clearChildren(sel_month);
                sel_month.appendChild(df);
            }

            sel_month.onchange = recalculateDays;

            generateMonths();
            recalculateDays();

            cont.appendChild(sel_year);
            cont.appendChild(sel_month);
            cont.appendChild(sel_day);
        }());
        //]]>  

        </script>

    <!--END CAELNDAR DROPDOWN-->

我只是使用HTML调用它：

<div id="calendar-container"></div>

以下是IE8开发人员工具中显示的输出：

<div id="calendar-container"/>

<select name="yearSel" id="yearSel" onchange="showRSS(document.getElementById('field2').value, document.getElementById('yearSel').value, document.getElementById('monthSel').value, document.getElementById('daySel').value)">
 <OPTION selected value=2013>2013</OPTION> <OPTION value=2014>2014</OPTION>
</select>

对此有何解决方案？

Answer 1

我认为你的问题可能在.setAttribute（）中;功能。 IE7 / 8支持是错误的或不存在的。

尝试类似这样的内容并使用'id'属性。

sel_year.id = "year2Sel";
sel_month.id = "monthSel";
sel_day.id = "daySel";

或者，它可能是您的onchange / onclick设置属性中的内容。您应该能够使用它而不是内联'onchange'：

element.onchange = function() {
    // Do something
}

虽然你必须为跨浏览器解决方案添加一些事件监听器/ attachEvent。

生成的Javascript下拉列表未在IE 8上显示

1 个答案: