删除选择一个选项，结果不显示在IE

这个网站是完全在Chrome浏览器，但不是在IE删除选择一个选项，结果不显示在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>

来源

2012-04-24 CL So

您的代码似乎好工作与不使用.live（）（即使它不应该根据我的工作没有生活）。如果您执行一些操作并检查源，那么所有事情都按计划进行。 IE浏览器似乎并没有更新它的复选框内容，但我不知道为什么是这样。 :( 也许如果你告诉我们为什么你这样做，我们可以找出一个IE友好的解决方案？:) – Sanchit 2012-04-24 12:28:33

我试过.live（）和.live（），生活是工作，不工作，所以它似乎.on（）不能100％替换.live（）。但我仍然想知道为什么.on（）和.focus（）在IE（在IE8＆9中测试）中不起作用，因为.live（）有性能问题，如果我终于找不到原因，那么我将使用。生活（）。我这样做是因为我让用户动态添加组合框的列表，并选择该选项。但是如果选择之前不允许选择相同的选项，所以我需要搜索所有选项，如果选中，则删除该选项。 – 2012-04-24 14:32:12

 $('select').live('focus',function(){ 
     $(this).find('option').eq(1).remove(); 
     });

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

来源

2012-04-24 12:05:37 nu6A

从jQuery 1.7开始，'.on（）'方法是将事件处理程序附加到文档的首选方法。 – RASG 2012-04-24 12:48:23

感谢信息@RASG，对于其他人在这里看看关于'** on **'[jQuery .live（）和.on（）之间的区别是什么（http://stackoverflow.com/questions/8042576）/whats-the-difference-between-jquery-live-and-on） – nu6A 2012-04-24 12:53:48

第一个作品是因为事件处理程序附加到DOM中当时唯一的“选择”。然后，当你点击'添加'时，一个新的'选择'元素被添加到DOM，但没有附加任何事件处理程序。我可能误解了你的问题，让我知道是否是这种情况。

如果您提供了清晰的规格，我可以写一个如何完成的简短示例。

来源

2012-04-24 12:17:58

我使用.clone（true）复制DOM，true表示使用eventhandler克隆DOM。我更改了代码，因此即使您单击其他克隆的选择，也会看到警告窗口，并且$（this）.html（）让您看到选择中的更改。 '$（ '选择'）专注（函数（）{ \t \t \t \t \t \t \t警报（$（本）的.html（））; \t \t \t \t \t \t \t $（本）.find（” 。选项“），EQ（1）一个.remove（）; \t \t \t \t \t \t \t警报（$（本）的.html（））; \t \t \t}）;' – 2012-04-24 13:52:48

对我来说工作得很好。
这是我改变：

<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-24 12:46:33 RASG

删除选择一个选项，结果不显示在IE

回答

相关问题