Javascript 修改jQuery document.ready函数_Javascript_Jquery_Dom

Javascript 修改jQuery document.ready函数

javascript jquery dom

Javascript 修改jQuery document.ready函数,javascript,jquery,dom,Javascript,Jquery,Dom,我正在尝试修饰jQuery document.ready函数 <html> <head> <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script type="text/javascript"> $(function() { console.log("ready2"); }

我正在尝试修饰jQuery document.ready函数

<html>
<head>
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script type="text/javascript">
        $(function() {
            console.log("ready2");
        });
    </script>
    <script type="text/javascript">
        $.fn.ready = (function(fn) {
            return function() {
                console.log("ready1");
                return fn.apply(this, arguments);
            }
        })($.fn.ready);
    </script>
</head>
<body>
    <img src="http://deelay.me/1000?http://my-site.com/image.gif" />
</body>
</html>

我希望看到的是浏览器控制台中的ready1和ready2，但是只有ready2。我错过了什么

FiddleJS：

更新1：其实很清楚为什么它不起作用-因为我先打电话给ready。。。。然后是另一个问题-如何在触发$.ready之前调用自定义函数？

您首先调用ready，然后才调用它。颠倒顺序。

这是修复方法：

$.fn.ready = (function(fn) {
        return function() {
            console.log("ready1");
            return fn.apply(this, arguments);
        }
    })($.fn.ready)();

请注意分号前面的结尾处。您必须调用返回的内部函数。

jQuery仅绑定到onreadystatechange或DOMContentLoaded事件[]。它检查document.readyState==是否完成

我的一个想法是绑定一个事件来检查它。这应该在完成之前发生

演示：

$。立即调用ready，并安排在文档准备就绪时调用作为参数传递的任何内容。@Vytalyi:事件在完全处理后触发，是的。但是$function{与执行$document.readyfunction相同{，那么你正在调用。在修改它之前准备好了。是的…那么另一个问题-有没有办法在触发$.ready之前调用我的自定义函数？@Vytalyi：在触发事件之前？为什么要这样做？假设我正在尝试覆盖我的外部自定义脚本中的某些内容，该脚本包含在.s结尾o我需要在DOM就绪之前执行此操作。它有意义吗？没有。您不想调用内部函数。您希望它返回并存储在$.fn.ready中。谢谢-这可能是最符合我需要的解决方案。非常好的解决方案！我不知道这是否是最好的解决方案，或者它是否适用于所有浏览器，但我很高兴能提供帮助：-

$(function () {
    console.log("ready2");
});

$(document).on('readystatechange', function(){
    if(this.readyState === 'interactive'){
        console.log('ready1');
    }
});