0

<select>在使用 JavaScript 操作标签时，我遇到了 Internet Explorer 8 的奇怪行为。

假设我想向 a 添加一个<option>，<select>而不是在 jQuery 中我可以使用类似$("select").prepend(myOption). 但是如果<select>元素是用 JavaScript 创建的并且用户已经打开了选择，这不起作用并且 Internet Explorer (8) 不会显示新选项。在 Firefox 中，这工作得很好。

一个例子：

<!doctype html>
<head>
    <meta charset="utf-8">
    <title>Test</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
    <script>
        function prependOption(select) {
            $("select").each(function(i, element) {
                var option = $('<option value="abc">xyz</option>');
                $(element).prepend(option);
            });
        }
        $(function() {
            var container = $("#container");
            container.append($("select.prototype").clone());
        });
    </script>   
</head>
<body>  
<input type="button" value="Click" onclick="prependOption(this)" /><br />
<div id="container">
    <select class="prototype">
        <option>Lorem ipsum</option>
    </select>
</div>
</body>
</html>

当您打开页面时，您应该会看到两个选择框——一个是普通的，一个是使用 jQuery 创建的clone()。如果单击该按钮，则会向它们添加一个选项。现在，如果您单击并打开两个选择框并再次单击该按钮，则只会将新选项添加​​到第一个选择框。

知道如何解决这种错误行为吗？我需要向<select>使用 JavaScript 创建的选项添加选项。

4

2 回答 2

0

试试这个 ：

new Object($("select.prototype"))
于 2013-04-04T13:27:19.427 回答
0

解决方案是避免clone()- 显然它在 Internet Explorer 8 中无法正常工作。

var select = $('<select></select>');
select.append($("select.prototype option").clone());
container.append(select);

因此，我没有克隆 <select>，而是创建了一个新的，并且只克隆了它的选项。

于 2013-04-09T07:55:51.473 回答