0

我曾经有过这样的事情：

$(function() {
$(".PortfolioFade img")
    .mouseover(function() { 
                    popup('PORTFOLIO');
                    var src = $(this).attr("src").replace("images/paperclip.png", "images/paperclip-black.png");
        $(this).attr("src", src);
    })
    .mouseout(function() {
                    ;
    });
    });

当我试图把它变成一个函数并调用它时，它根本不起作用。图像没有被替换。

以下是不起作用的函数和后续调用，我不知道为什么它不起作用。

 $(document).ready(function() {
   // put all your jQuery goodness in here.
   $('body').hide().fadeIn(1000);

   //Changing Fonts
   function changeFont(element, fontFamily, fontSize)
{
    $(element).css("font-family", fontFamily);
    $(element).css("font-size", fontSize);
}
    function ImageRollover(image_element, popup_name, original, replacement)
{
    $(element)
        .mouseover(function(){
            popup(popup_name);
            var src = $(this).attr("src").replace(original,replacement);
            $(this).attr("src",src);

        })
        .mouseout(function(){
            ;
        });
}

$(function) {
   ImageRollover(".Portfolio img",'PORTFOLIO',"images/paperclip.png","images/paperclip-black.png");
});


 });
4

1 回答 1

1

编辑：对不起，我首先应该看到的是你的ImageRollover()函数声明了一个参数image_element，但是在你使用的函数中element。所以在功能变化中：

$(element)
    .mouseover(function(){

至：

$(image_element)
    .mouseover(function(){

（忘记我之前说过的话。）

您的原始版本具有但新版本没有的是文档就绪处理程序。尝试将您的ImageRollover函数调用放入准备好的文档中，如下所示：

$(function() {
   ImageRollover(".Portfolio img",'PORTFOLIO',"images/paperclip.png","images/paperclip-black.png");
});

您不能将事件处理程序附加到尚未解析的元素 - 在整个文档被解析之前不会调用文档就绪处理程序，因此此时您可以附加事件处理程序。或者，您可以将脚本放在它所操作的元素之后的某个位置，例如，在正文的末尾。

我也倾向于将ImageRollover函数声明移动到准备好的文档中，只是为了让它远离全局命名空间（假设你只从准备好的文档中调用它），尽管这不是让它工作的必要条件。

于 2012-06-12T21:32:40.567 回答