dynamic create option element for select by javascript

最新推荐文章于 2026-01-05 12:22:51 发布

原创最新推荐文章于 2026-01-05 12:22:51 发布 · 998 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

JavaScript 专栏收录该内容

3 篇文章

订阅专栏

<html>
    <body
        <form action="#" method="POST">
            <select id="dynamicOption">
            </select>
            <input type="submit" value="Click Me" onclick="return showOption();"/>
        </form>
        
    </body>
    <script type="text/javascript">
        for(var i = 0;i < 20;++i){
                var objOption = document.createElement("OPTION"); //Create OPTION element
                objOption.text = "text" + i; //Option's text (show it in page)
            objOption.value = "value" + i; //Option's value
            document.getElementById("dynamicOption").options.add(objOption);   //Add option element to select label
    }
    
    function showOption(){
        alert("the options length is :" + document.getElementById("dynamicOption").options.length);
        alert("the last option value is :" + document.getElementById("dynamicOption").options[19].value);
        return false;
    
    }
    </script>
</html>