Question

为什么以下工作在Firefox中，但不在IE中？

            $("#bCompare").bind("click", function(e){
                $("img[src='s1.gif']").each(function (i) {
                    $("#cSelected").append("<div class='cHolder'></div>");
                });
            });

更新1：一位评论者提到我没有提供足够的信息，虽然我不确定还需要什么。上面的代码用src s1.gif检查图像的数量。然后它运行一个循环，将类cHolder的div插入div cSelected。添加的cHolders数量取决于s1.gif图像的数量。

任一浏览器中都没有错误消息。 Firefox 3.5和IE 7

更新2：我已将其缩小为“每个”方法中的问题。在循环外，它在两者中都可以正常工作。有没有办法解决这个问题？感谢。

Answer 1

你遇到的实际上真的很有趣。我从你的代码开始，结果很混乱。 src='s1.gif'选择器在Firefox和IE8中运行良好，但在IE7或IE6中运行不正常。我最终得到了一个测试文档来找出这个选择器：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
    google.load("jquery", "1.3.2");
</script>

<img id="foo" src="foo.png"/>

<script type="text/javascript">
    alert('# images: ' + $('img').length + ', ' + 'Src: "' + $('#foo').attr('src') + '", Num of imgs selected by src: ' + $("img[src='foo.png']").length);
</script>
</body>
</html>

假设您在与此测试文档相同的目录中有一个名为“foo.png”的图像文件，则分别在FF3.5，IE8，IE7和IE6中收到以下警报：

# images: 1, "foo.png", Num of images selected by src: 1
# images: 1, "foo.png", Num of images selected by src: 1
# images: 1, "foo.png", Num of images selected by src: 0
# images: 1, "foo.png", Num of images selected by src: 0

因此，尽管警报正确报告$("img[src='foo.png']")，但选择器src显然无法在IE6和7中正确找到图像。如果将选择器src更改为完整路径到图像（$("img[src='http://whatever/foo.png']")），则会得到相反的结果。它可以在IE6 / 7中找到，但不能在IE8或FF中找到。

非常奇怪。在这些浏览器中，src必须以某种方式在DOM中以不同方式表示，但JQuery不能正确解释。

Gaby实际上发布了一个正确的答案，但后来他删除了它。如果您使用带有$符号的选择器，例如img[src$='foo.png']，它似乎适用于所有这四种浏览器，因为它与属性值末尾的foo.png匹配。 / p>

我建议你选择那种方法。

Answer 2

尽量缩小问题范围。它可能是（至少）三件事之一：

处理程序不绑定或永远不会被调用。在外部函数中添加alert以查找。
img选择器没有为您提供所需的图像。添加另一个alert或在某处放置一个计数器。
div实际上是在创建，但是由于IE处理你的cHolder类的方式可能发生了意想不到的事情，你看不到它。

如果没有一个完整的例子，那可能是我们能做的最好的事情。

Answer 3

现在，我不完全确定，但是......

...尝试：

$("img[src=s1.gif]")

如果没有，请发布

的输出

alert( $("img[src='s1.gif']").length );

和

alert( $("img[src='s1.gif']").length );

在firefox和IE中运行时

jquery兼容性问题

3 个答案: