Javascript 在 $(document).ready() 触发之前运行一个函数

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4098504/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 10:36:10  来源:igfitidea点击:

Running a function just before $(document).ready() triggers

javascriptjqueryeventsdocument-ready

提问by Raynos

I've attached multiple functions in multiple files to $(document).ready and would like to attach a single function to happen before them as either the first that $(document).ready handles or to independently trigger before the $(document).ready handler.

我已将多个文件中的多个函数附加到 $(document).ready 并希望附加一个函数在它们之前发生,作为 $(document).ready 处理的第一个函数或在 $(document) 之前独立触发.ready 处理程序。

Is there any way to handle the order of functions that jQuery triggers internally as part of jQuery.fn.ready or to hook in a function that calls just before jQuery.fn.ready.

有什么方法可以处理 jQuery 作为 jQuery.fn.ready 的一部分在内部触发的函数的顺序,或者挂接在 jQuery.fn.ready 之前调用的函数。

Is editing jQuery.fn.ready in a 3rd party script safe to do or will it cause horrible knock on effects in other 3rd party plugins (apart from plugins that edit jQuery.fn.ready themselves)

在 3rd 方脚本中编辑 jQuery.fn.ready 是否安全,还是会在其他 3rd 方插件中造成可怕的敲击效果(除了自己编辑 jQuery.fn.ready 的插件)

[Edit]:

[编辑]:

as an example

举个例子

$(document).ready(function b() {});
....
$(document).ready(function a() {/* optional setup*/});
....
$(document).ready(function c() {});

function a needs to happen first irrelevant of order, but only gets called on a few pages. I cant guarantee the order of b or c so I cant trigger custom events at the start of b or c to trigger a.

函数 a 需要首先发生,与顺序无关,但只在几页上被调用。我不能保证 b 或 c 的顺序,所以我不能在 b 或 c 开始时触发自定义事件来触发 a。

So I would like a generic solution that I can use to forcefully place a at the start of jQuery's internal readyList or hook into jQuery's ready function and edit it safely so it calls a before any of the other functions in readyList.

所以我想要一个通用的解决方案,我可以用它来强行将 a 放在 jQuery 的内部 readyList 的开头或挂钩到 jQuery 的 ready 函数并安全地编辑它,以便它在 readyList 中的任何其他函数之前调用 a。

[Further Edit]

[进一步编辑]

If possible I would rather not have to redesign the javascript code execution order or have to touch any other code apart from function a(). I'm aware restructuring would allow me to get around this problem but I'd rather just write a single function like

如果可能的话,我宁愿不必重新设计 javascript 代码执行顺序,也不必接触除函数 a() 之外的任何其他代码。我知道重组可以让我解决这个问题,但我宁愿只写一个函数,比如

$.beforeReady(function a() {});

回答by Jacob Relkin

This would be a time where I would trigger a custom event that all of your other files would bindto, you would only have one readyhandler, which would do stuff, then trigger the custom event.

这将是我将触发所有其他文件都会触发的自定义事件的时候bind,您将只有一个ready处理程序,它可以执行某些操作,然后触发自定义事件。

So, somewhere else in your code, instead of using $(document).ready, you would use

所以,在你的代码中的其他地方,而不是使用$(document).ready,你会使用

$(window).bind('setup', function() {
   //code here...
});

And/or

和/或

$(window).bind('loaded', function() {
   //some other code here...
});

And in your one and only readyhandler, you'd do something like this:

在你唯一的ready处理程序中,你会做这样的事情:

$(document).ready(function() {
   $(window).trigger('setup');
   $(window).trigger('loaded'):
});

回答by BGerrissen

$(document).ready()or simply $(function(){})is just an .addEventListenerimplementation (well not exactly, but close), meaning you can add listeners before and after.

$(document).ready()或者$(function(){})只是一个.addEventListener实现(不完全是,但很接近),这意味着您可以在前后添加侦听器。

$(document).ready(listener); // goes off first.
$(document).ready(otherListener); // goes off 2nd.

And so on, it's not hard to sandwich functions. There's no need to hack .ready()imo.

等等,把函数夹在中间并不难。没有必要破解.ready()imo。

回答by EamonnM

I just had the exact same problem. I put a tiny script on GitHub that adds a $.beforeReady() function. Funny :)

我只是遇到了完全相同的问题。我在 GitHub 上放了一个小脚本,它添加了一个 $.beforeReady() 函数。有趣的 :)

https://github.com/aim12340/jQuery-Before-Ready

https://github.com/aim12340/jQuery-Before-Ready

Just load the script right after jQuery like in this example:

就像在这个例子中一样,在 jQuery 之后立即加载脚本:

<html>
    <head>
        <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
        <script src="jquery-before-ready.js"></script>
    </head>
    <body>
        <script>
            $(document).ready({
                alert("This function is declared first!")
            })
        </script>
        <script>
            $.beforeReady(function(){
                alert("This function is declared second but executes first!")
            })
        </script>        
    </body>
</html>