Question

我正在开发一个名为“popup”（$(".messageBox").popup()）的插件。

以下是我的代码的一部分：

$(this).fadeIn(settings.fadeDuration);
    console.log($(this).attr("class"));

    console.log(settings.timeOut);
    setTimeout( function(){
        console.log($(this).attr("class"));
        $(this).fadeOut(settings.fadeDuration);
}, settings.timeOut);

这是popup.min.js中的代码，现在下面是index.html中的代码：

$(function(){
    $(".messageBox").popup();
});

我的弹出窗口显示，并且正确淡入，但它不会在1000ms之后消失，因为它应该......我该怎么办？我打开了控制台，但没有显示错误。

Answer 1

因为this回调方法中的setTimeout引用错误

您可以使用闭包变量来保存参考

$(this).fadeIn(settings.fadeDuration);
console.log($(this).attr("class"));

console.log(settings.timeOut);
var el = this;
setTimeout( function(){
    console.log($(el).attr("class"));
    $(el).fadeOut(settings.fadeDuration);
}, settings.timeOut);

或使用$.proxy()将自定义上下文传递给回调

$(this).fadeIn(settings.fadeDuration);
console.log($(this).attr("class"));

console.log(settings.timeOut);
setTimeout($.proxy(function(){
    console.log($(this).attr("class"));
    $(this).fadeOut(settings.fadeDuration);
}, this), settings.timeOut);

jQuery插件无法正常工作

1 个答案: