图像替换时的错误

我已经尝试了所有可能的方法组合来替换图像，但没有找到有效的解决方案。我在这里上传了有问题的代码：http：//dl.dropbox.com/u/2959730/index.html 我建议下载源代码并尝试代码。问题在于应该附加到#playButt img的player.playPause（）函数。请帮帮我几个小时了！编辑：我已经纠正了所有内容，根据建议我现在使用此代码用于playPause（），但它仍然无效！这是我遇到的最令人沮丧的事情......

this.playPause = function(){  
    this.status = !this.status;  
    var status = this.status;
    var playEl = document.getElementById('play');
    $("#play").fadeOut(200, function(){  
        if(status)  
            playEl.src = "img/pauseButton.png";
        else  
            playEl.src = "img/playButton.png";
        $("#play").fadeIn(200); 
    }) 
}

已邀请:

3 个回复

嗓瑰

playPause()在playlist.js中定义为var player的属性。您的onclickonclick="playPause(); return false;"不会调用playPause，因为它无法在全局范围内找到该函数。您需要将您的onclick更改为：

onclick="player.playPause(); return false;"

更新：问题出在这个回调上：

$("#play").fadeOut(200, function(){  
    if(this.status)  
        playEl.src = "img/pauseButton.png";
    else  
        playEl.src = "img/playButton.png";
}).fadeIn(200);

this.status在回调中未定义，因为this现在指的是元素#play。要解决这个问题，你需要在回调之前声明var status = this.status，并在回调中测试if(status)。另外两件事： .fadeIn(200)应放在回调中，否则它在fadeOut完成之前运行（因此根本没有淡入淡出效果）。你不需要var playEl = document.getElementById('play');因为你正在使用jQuery来抓取元素。在回调中，this关键字已经引用了元素。完整的代码应该是：

var status = this.status = !this.status;
$("#play").fadeOut(200, function(){  
    if(status)  
        this.src = "img/pauseButton.png";
    else  
        this.src = "img/playButton.png";
    $(this).fadeIn(200);
});

另一个更新：除了上述修复之外，还有一个问题。看起来页面上有两个元素，id="play"。实际上，整个#ipod2都是重复的。我检查了源代码，但它不存在，仅在实时DOM中。如果您在控制台中$("#play").remove();，您将看到图像替换代码现在可以正常工作。但是，您需要找出在JS中克隆ipod2的位置并修复它。

慷祈霖黑

从我所知道的，你实际上并没有附加到#playButt图像。您所做的只是定义该图像的onclick属性，只调用未定义的playPause。自问你问题以来，你有没有更改过文件？如果你有onclick =“player.playPause（）;它返回false;它是否有效在#playButt图像的onclick处理程序中？

荆怖赡

你肯定需要有player.playPause（）而不是playPause（）。而且你似乎在slider.js的css或height函数中遇到问题，因为Firebug报告a [0]未定义。

要回复问题请先登录或注册

图像替换时的错误

3 个回复

发起人

image_replacement

问题状态

图像替换时的错误

与内容相关的链接

3 个回复

发起人

image_replacement

问题状态