应用错误收集

问题是您单击下拉菜单正在加载项目。在加载项目之前，您已经扩展了下拉菜单。如果单击它，然后重新打开，它将是正确的大小。解决方案是在单击下拉菜单之前先加载项目。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
    <script>
        var data = JSON.parse("[{\"name\":\"EE&CS\",\"id\":1},{\"name\":\"Management\",\"id\":2},{\"name\":\"Subjects\",\"id\":3},{\"name\":\"Other\",\"id\":32},{\"name\":\"Test\",\"id\":33}]");
        window.onload = function () {
            var select = document.getElementById("select-test");

            for (var i = 0; i < data.length; i++) {
                var subject = data[i];
                select.appendChild(getNode("<option value=\"" + subject.id + "\">" + subject.name + "</option>"));
            }
        };

        function getNode(str) {
            return new DOMParser().parseFromString(str, "text/html").body.childNodes[0];
        }
    </script>
</head>
<body>
<select id="select-test" data-loaded="0">
    <option value="" disabled selected>-- Choose subject --</option>
</select>
</body>
</html>

如何使用JavaScript调整<select>的下拉列表的高度？

1 个答案: