通过JavaScript选择菜单:在Mozilla中不工作(`undefined`),但在Chrome中工作

时间:2015-11-02 11:13:45

标签: javascript google-chrome mozilla

我将<li>数据放在下拉框中。 &#34;检查元素&#34;选项显示文本在那里,但在下拉列表中没有显示。

这是我的html和js代码。

HTML

<h1>
                <ul class="lev1">
                    <li>
                        menu-1
                    </li>
                    <li>
                        menu-2
                    </li>
                    <li>
                        menu-3
                    </li>
                    <li>
                        menu-4
                    </li>
                </ul>
  </h1>

        <select id="select2-menu" name="term" class="search_product">
            <option>
                All
            </option>
        </select>

的JavaScript

    <script>
    var ul=document.getElementsByClassName('lev1');
        var li = ul[0].getElementsByTagName('li');
        var select = document.getElementById('select2-menu');

        for (var i = 0; i < li.length; i++) {
            var option = document.createElement("option");
            option.value = li[i].innerText;
            option.text = li[i].innerText;
            select.add(option, null);
            try {
                select.add(option, null); //Standard
            } catch (error) {
                select.add(option); // IE only
            }
        }
    </script>

1 个答案:

答案 0 :(得分:0)

试试这个

<script>
     var ul=document.getElementsByClassName('lev1');
            var li = ul[0].getElementsByTagName('li');
            var obj = document.getElementById('select2-menu');

            for (var i = 0; i < li.length; i++) {
                var opt = document.createElement("option");
                opt.value = li[i].innerHTML;
                opt.text = li[i].innerHTML;
                //select.add(option, null);
                obj.appendChild(opt);
            }
</script>