1

这个 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>
4

3 回答 3

0

对我来说很好。
这就是我改变的：

<script type="text/javascript">
    $(window).load(function(){
        $('#add').on('click', function(){
            $(this).parent().parent().before($('tr').eq(0).clone(true));
        });

        $('select').on('focus', function(){
            $(this).find('option').eq(1).remove();
        });
    });
</script>

这是完整页面，带有更“标准”的代码

<html>

<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
    <script type="text/javascript">
        $(window).load(function(){
            $('#add').on('click', function(){
                $('#formclone').append($('.myselect').eq(0).clone(true));
            });

            $('select').on('focus', function(){
                $(this).find('option').eq(1).remove();
            });
        });
    </script>
</head>

<body>
<div id="divform">
    <form class="myform">
        <select class="myselect">
            <option>1</option>
            <option>2</option>
            <option>3</option>
        </select>
        <input id="add" type="button" value="add">
    </form>
</div>
<p>
    <div id="divclone">
        clones: 
        <form id="formclone"></form>
    </div>
</p>
</body>

</html>
于 2012-04-24T12:46:33.527 回答
0

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

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

于 2012-04-24T12:17:58.970 回答
0 
        $('select').live('focus',function(){
        $(this).find('option').eq(1).remove();
        });

使用现场..它可能工作。

于 2012-04-24T12:05:37.173 回答