Question

我使用.eq（）方法选择已知元素的特定子元素。 IE和Chrome / FF中的元素索引似乎不同，因为.eq（2）根据浏览器返回不同的值。（我正在寻找的元素在FF / Chrome中显示为.eq（2），但在IE中显示为.eq（3）

例如，

alert($(this).parent().children().eq(2).text());

根据浏览器显示不同的结果。

这是有问题的标记：

<div>
  <span>
    <input onclick="player.search.Groupings($(this).parent().children().eq(2).text(), $(this).parent().children().eq(0).is(':checked'));" type="checkbox"></input>
    <span>Fake Initiative A</span><span>1</span>
  </span>
  <span>
    <input onclick="player.search.Groupings($(this).parent().children().eq(2).text(), $(this).parent().children().eq(0).is(':checked'));" type="checkbox"></input>
    <span>Initiative B Not Real</span><span>2</span> </span>
</div>

（我删除了属性，内联css等 - 如果没有这些属性就会发生同样的事情。）

有更好的方法吗？

Answer 1

我认为这与空文本节点有关，Firefox不会注册之间的空格，＆lt; span＆gt;和＆lt;输入＆gt;标签，如IE所示，因此对于FF，第二个节点将是＆lt; input＆gt;标记（＆lt; span＆gt;＆lt; input＆gt;），因为它将是文本节点（＆lt; span＆gt; -empty text node-＆lt; input＆gt;）。

编辑：

经过一些测试（以前的答案只是我遇到的一个常见问题所以假设它对你来说可能是一样的），问题是IE将你的结束标签作为dom中的一个元素。

如果您将代码更改为缩短结束标记，即：

<div>
  <span>
    <input type="checkbox" />
      <span>Fake Initiative A</span><span>1</span>
  </span>
  <span>
    <input type="checkbox" />
    <span>Initiative B Not Real</span><span>2</span>
  </span>
</div>

然后它应该按预期工作。

仅供参考我的整个测试脚本（仅提醒文本）：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<html>
<head>
    <title>Title here!</title>
    <script type="text/Javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
    <script type="text/Javascript">
        $(function(){
            $("input:checkbox").bind('click', function(){
                alert($(this).parent().children().eq(2).text());
            });
        }); 
    </script>
</head>
<body>
<div>
  <span>
    <input type="checkbox" />
    <span>Fake Initiative A</span><span>1</span>
  </span>
  <span>
    <input type="checkbox" />
    <span>Initiative B Not Real</span><span>2</span> </span>
</div>

</body>
</html>

jQuery .eq（x）在IE中返回的元素不同于FF / Chrome中的元素

1 个答案: