jQuery 图像 src 属性在 IE7 中损坏

Question

我正在使用 jQuery(在用 C# 编写的 ASP.Net 2.0 网站中，FWIW)来处理相当简单的 div 扩展和图像交换(用于显示状态指示)，它在 FF 3.5.5 中的工作方式就像一个魅力，但是在 IE 7 中失败，我想知道各位好心人是否能够帮助我确定为什么会出现这种情况。

我正在从谷歌代码加载 jQuery 1.3.2，在 dom 中查找一些元素，切换一些元素的可见性，然后更改显示状态图像的源属性。在 Firefox 中添加显示状态图像的 src 属性的警报会产生我所期望的结果，但在 IE 中它是未定义的。

相关代码片段如下:

<script language="javascript" type="text/javascript">
    google.load("jquery","1.3.2");
</script>

<script language="javascript" type="text/javascript">
    $(document).ready( function() {

        $(".prodDownloadSection").click( function() {

            var $catName = $(this).attr("id");
            var $sectionName = $catName.substr(0,$catName.length-3);
            var $productContainerDiv = $("#"+$sectionName);
            $catDisplayState = $("#"+$sectionName+"displayState");
            $productContainerDiv.slideToggle();
            $productContainerDiv.toggleClass("selected");
            $displayState = $productContainerDiv.prev("li").find("img.displayState");
            alert($displayState.attr("src"));
            if( $displayState.attr("src") == "img/placeholders/arrow-closed.gif") {
                $displayState.attr("src", "img/placeholders/arrow-open.gif");
            } else {
                $displayState.attr("src", "img/placeholders/arrow-closed.gif");
            }

        });

    });
</script>

没有 JavaScript 错误，并且图像在服务器上就位，IE 甚至无法识别 src 属性，因此 if 子句永远不会计算为 true。

有人知道为什么我在 IE 中无法获取该图像的 src 吗？

Answer 1

18 个月后(我希望 18 个月更明智)回顾这件事，我终于弄清楚了问题所在。

本质上，Firefox 在这里做了“错误”的事情，因为它在 prev() 的返回中包含了父级。称呼。在此页面的 html 架构中 <li>我正在寻找包含 $productContainerDiv元素，所以prev()正确地在 IE 中返回任何内容，因为没有 <li> $productContainerDiv 的 sibling .

当我更改 prev("li") 时至parent("li")我得到一个能够找到选择器 ("img.displayState") 定义的元素的元素。如果我当时工作的网站是 jQuery >= 1.4，parentsUntil("li")将是一个更好的解决方案。

事件处理程序的更正代码应如下所示:

$(".prodDownloadSection").click( function() {

    var $catName = $(this).attr("id");
    var $sectionName = $catName.substr(0,$catName.length-3);
    var $productContainerDiv = $("#"+$sectionName);
    $productContainerDiv.slideToggle();
    $productContainerDiv.toggleClass("selected");
    $displayState = $productContainerDiv.parents("li").find("img.displayState");
    if( $displayState.attr("src") == "img/placeholders/arrow-closed.gif") {
            $displayState.attr("src", "img/placeholders/arrow-open.gif");
    } else {
            $displayState.attr("src", "img/placeholders/arrow-closed.gif");
    }

});

希望这对路上某个地方的人有帮助。