0

Ajax を介して金額を取得する関数にポストする 3 つの選択メニューがあります。

問題は、すべてのブラウザで選択メニューが表示されるのに、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>

これに対する解決策はありますか？

4

1 に答える 1

0

あなたの問題は .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 を追加する必要があります。

于 2013-01-29T10:23:38.910 に答える