javascript - 删除 HTML 选择中的选项,结果在 IE 上不显示

标签 javascript jquery internet-explorer html-select

此 HTML 在 Chrome 中完全有效,但在 IE 中无效。

该文件非常简单,只有两个函数:

  1. 点击添加按钮,第一行将被克隆并放置在添加按钮之前。

  2. 单击组合框,第二个选项将被删除。

现在问题是函数2:

  1. 在 IE 中,加载此页面,然后单击添加按钮添加一些组合框。

  2. 单击第一个组合框,您将不会在组合框中看到第二个选项。 (这是正确的结果。)

  3. 单击第二个组合框或其他克隆的组合框,然后您将看到第二个选项仍在组合框中,因此它没有被删除。 (这不是正确的结果。)

  4. 如果您在开发者工具中查看源代码,您可以看到第二个选项已被删除。

那么,如何去掉IE中的该选项呢?

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
jQuery(document).ready
(
    function()
    {
        $('#add').click(function(){
                        $(this).parent().parent().before($('tr').eq(0).clone(true));
        });
        $('select').focus(function(){
                        $(this).find('option').eq(1).remove();
        });
    }
);
</script>
</head>
<body>
<table>
    <tr>
        <td>
            <select>
                <option>1</option><option>2</option><option>3</option>
            </select>
        </td>
    </tr>
    <tr>
        <td><input id="add" type="button" value="add"/></td>
    </tr>
</table>
</body>
</html>

最佳答案

第一个方法有效,因为事件处理程序附加到此时 DOM 中唯一的“选择”。然后,当您单击“添加”时,一个新的“选择”元素将添加到 DOM,但该元素没有附加任何事件处理程序。我可能误解了你的问题,如果是这样的话请告诉我。

如果您提供明确的规范,我可以写一个简短的示例来说明如何完成它。

关于javascript - 删除 HTML 选择中的选项,结果在 IE 上不显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10297322/

相关文章:

javascript - Node.js "write after end"错误

javascript - 正则表达式匹配 #{} 中的名称以供模板使用

jquery - 数据不会加载到 div 中

javascript - 在 AJAX 调用上返回 html 表单字段

当高度为自动时,jQuery OuterHeight/Height 返回错误的高度值

JQuery AJAX .load - Flash 图表无法在 IE 中加载

javascript toFixed()

html - &lt;meta http-equiv ="X-UA-Compatible"内容 ="IE=Edge"/> 在 IE 11 中不起作用

ruby-on-rails - 在 Rails 中通过 SSL 在 Internet Explorer 中下载文件

javascript - JS Regexp - 如何在字符串中查找文本