2

我编写了一个快速图像交换类，通过将“_grey”添加到图像 src 来切换悬停图像。该代码在除 ie6 之外的所有浏览器中的整个站点中都运行良好。substr 似乎在这里无法正常工作-请提供任何建议！？

代码如下 -

$(document).ready(function() {
var initImg;    
    $('img.swapGrey').hover(function() {


        initImg = $(this).attr("src");  
        var imgType = (initImg).substr(-4);
        alert(initImg);
        var greyImg = initImg.slice(0, -4) + "_grey" + imgType;
        alert(greyImg);

        $(this).attr("src",greyImg);

            }, function() {
        $(this).attr("src",initImg);

    });


});
4

5 回答 5

3

使用slice而不是substr. substr是非标准的，而slice在 ECMAScript 3 规范中指定（包括负位置），并且在所有主要浏览器中都受支持，包括 IE 6。

于 2010-08-17T13:42:29.577 回答
1

只需在 IE 中使用正的起始位置。

于 2010-08-17T13:40:46.413 回答
1

IE 不支持substr.

于 2010-08-17T13:41:50.233 回答
0

尝试将您的代码放入load事件中，而不是ready：

$(window).load(function(){
  // your code...
});

使用事件的原因load是当图像完全加载到页面中时，与ready事件不同。

于 2010-08-17T13:39:45.293 回答
0

比需要的更详细（以显示函数的效果），但如果 test.jpg 是 img 元素的 src，则基本上将 test.jpg 更改为 test_grey.jpg。

    $(document).ready(function() {
        var initImg;
        $('img.swapGrey').hover(function() {


            initImg = $(this).attr("src");
            var len = initImg.length - 4;
            var imgType = initImg.slice(len);
            alert(":"+imgType+":");
            alert(initImg + " is " + len +":"+ imgType);
            var greyImg = initImg.slice(0, -4) + "_grey" + imgType;
            alert(greyImg);

            $(this).attr("src", greyImg);

        }, function() {
            $(this).attr("src", initImg);
      });
 });
于 2010-08-17T14:08:08.173 回答