使用 nameProp 的 JQuery 图像翻转在 Firefox 和 Chrome 中不起作用答案

【问题标题】：JQuery image rollover using nameProp doesn't work in Firefox and Chrome使用 nameProp 的 JQuery 图像翻转在 Firefox 和 Chrome 中不起作用
【发布时间】：2014-01-04 14:34:54
【问题描述】：

我有一个 JQuery 函数，当光标悬停在较小的图像上时，它可以将缩略图图像转换为较大的图像。这在 IE 中运行良好，但在 Firefox 和 Chrome 中根本不行。我是 JQuery 的新手。有什么与“nameProp”相关的东西应该有所不同吗？我的功能如下。谢谢。

        $(document).ready(function(){
            $("#thumbs img").mouseover(function(){
                var objthis = $(this)[0];
                document.getElementById("picture").src=objthis.nameProp;
            });
        });

【问题讨论】：

s$(document).ready(function(){ .. 开头的s 是您在此处的帖子中犯的错误，还是实际上在代码中？此外，当您在事件处理程序中时，您不需要访问 $(this) 中的任何子值。 $(this) 将引用当前元素（在您的情况下，这是 img 元素）。
“s”是一个帖子错字...对不起。你的意思是我不需要“img”或“[0]”？看来我需要这些元素。我试过没有每一个都没有。

标签： javascript jquery google-chrome firefox dom

【解决方案1】：

nameProp是专有扩展，仅在IE中可用，请改用src属性值。

document.getElementById("picture").src = this.getAttribute('src');

或者

document.getElementById("picture").src = $(this).attr('src');

另请注意，在鼠标悬停处理程序中 this 已经代表了您需要处理的元素，因此您无需执行 var objthis = $(this)[0];

【讨论】：

我用的是第一个。非常感谢！我碰巧注意到我在 Firefox 调试器中没有看到“nameProp”。但是还没有足够的 JQuery 来解决它。再次感谢！这适用于所有 3 个浏览器。