Question

我的插件允许您在其选项中指定回调。插件可以在DOM准备好之前运行，但我需要确保回调仅在DOM准备就绪后运行，因此我将callback.call()包装在$( document ).ready()处理程序中。

问题是我想在回调中维护插件的上下文。换句话说，在回调中，我希望this成为插件，而不是document。

这就是我想出来的，但我不确定这是不是最好的方法。

function MyPlugin( element, options ){
    this.element = element;
    this.options = $.extend( {}, defaults, options );

    MyPlugin.prototype = {
        functionWithCallback: function(){
            if ( typeof this.options.callback == 'function' )
                $( document ).ready( function( plugin ){ plugin.options.callback.call( plugin ) }( this )
        }
    }
}

最后一行是丑陋的，但它允许我将插件的this上下文传递给回调。

我宁愿做$( document ).ready( this.options.callback )并完成它，但是在回调中，this是document并没有真正帮助，并不一定能让我轻松访问插件被调用的元素...

有更好的方法吗？

Answer 1

对于这种情况，

Function.prototype.call是一个非常可靠的解决方案。

使用this的不同上下文调用函数是它的用途的一部分。

如果您想要更优雅的ES5解决方案（仅限新版浏览器），您可以使用.bind

 $(document).ready(plugin.options.callback.bind(plugin));

Bind设置函数的this值，以便在调用它时（以及其他参数可选）。以下是.bind $.proxy工作原理的an example。

如果您想使用，jQuery会使用$(plugin.options.callback.bind(plugin));填充它。

您也可以

{{1}}

使用插件上下文调用jQuery的ready（）

1 个答案: