Question

奇怪的问题。此代码在Chrome / IE中完美运行。但是由于某些原因它在FF 3.6中不起作用。控制台显示没有JS错误。

应该查找具有特定src属性的所有图像，并在悬停时替换src（我知道其他方法，如css hover等，我有理由使用这种技术 - 它不仅仅是翻转，它是动画视频大拇指）。

$("img[src*='libraries/phpthumb/phpThumbYT.php']").each(function(){
var t=$(this);
var src1= t.attr('src'); // initial src
var old_src = src1.substring(src1.lastIndexOf('media/'), src1.lenght);; // extract old source attr    
var media_id = old_src.substring(6,8); // extract media ID (directory name)
if ( old_src.indexOf("animation=1") != -1 )
{
    t.hover(function(){
        // on hover
        $(this).attr('src', 'libraries/phpthumb/phpThumbYT.php?w=131&h=92&far=C&iar=1&sfn=3&zc=C&f=gif&src=http://domain.name/media/'+media_id+'/preview.gif');  
    }, function(){
       // on rollout
        $(this).attr('src', src1);
    });
}
});

我怀疑选择器可能有问题吗？有什么想法吗？

Answer 1

终于找到了解决方案。

问题在于src1.lenght对'undefined'值进行了评分。虽然Alex提出了问题的来源，但W3C上的文档显示长度是字符串的有效属性。

然而，问题本身显然是由'undefined'中src1.substring(src1.lastIndexOf('media/'), src1.lenght);值的不同处理引起的。 Chrome和IE将'undefined'值简单地视为不存在，因此字符串被解析直到结束。但是在FF中，子串函数未能完全返回整个字符串。

在隔离出这个问题之后，我使用仅带一个参数的子字符串修改了脚本，因为我实际上希望它解析到结束，所以根本不需要第二个参数。

Beneath是适用于Chrome + IE + FF的最终代码。

$("img[src*='libraries/phpthumb/phpThumbYT.php']").each(function(){
var t=$(this);
var src1= t.attr('src'); // initial src
var old_src = src1.substring(src1.lastIndexOf('media/')); // extract old source attr    
var media_id = old_src.substring(6,8); // extract media ID (directory name)
media_id = media_id.replace('/',''); // trim '/' from the end of media_id in case the ID is < 10
if ( old_src.indexOf("animation=1") != -1 )
{
    t.hover(function(){
        // on hover
        $(this).attr('src', 'libraries/phpthumb/phpThumbYT.php?w=131&h=92&far=C&iar=1&sfn=3&zc=C&f=gif&src=http://slovoprekazdeho.sk/media/'+media_id+'/preview.gif');  
    }, function(){
       // on rollout
        $(this).attr('src', src1);
    });
}
});

jQuery.attr（'src'）替换不在FF中工作

1 个答案: