jQuery $(function(){})和$(document).ready一样吗?

时间:2021-08-10 15:59:43

To have a working datepicker on a field, I have to put this script inside my element

要在字段上有一个工作日期选择器,我必须将此脚本放在我的元素中

$( function() {
  $( "#date_datepicker" ).datepicker( { dateFormat: "yy-mm-dd" } );
});

Removing the $( function() { makes the datepicker not work.

删除$(function(){使得datepicker不起作用。

So does it mean that the $( function() { is the same as $(document).ready?

那么它是否意味着$(function(){与$(document).ready相同?

I'm trying to optimize my javascript codes so knowing this might help.

我正在尝试优化我的JavaScript代码,因此知道这可能会有所帮助。

7 个解决方案

#1


22  

See the extract below from http://api.jquery.com/ready/

请参阅http://api.jquery.com/ready/中的摘录

All three of the following syntaxes are equivalent:

以下所有三种语法都是等效的:

  • $(document).ready(handler)
  • $().ready(handler) (this is not recommended)
  • $()。ready(处理程序)(不建议这样做)

  • $(handler)

#2


4  

Yes, it's a shorthand version of the same thing. The $ function calls the $(document).ready function when passed a function as an argument.

是的,它是同一件事的速记版本。当函数作为参数传递时,$函数调用$(document).ready函数。

If you're trying to optimise in terms of speed - both will perform pretty much equivalently, however the longer $(document).ready(handler) will be minimally faster if executed lots of times.

如果你试图在速度方面进行优化 - 两者都会表现得非常相似,但是如果执行很多次,那么更长的$(document).ready(handler)会更快。

If you're trying to optimise in terms of file size - use a minifier.

如果您正在尝试优化文件大小 - 请使用缩小器。

IMO the best you can do is to 'optimise' in terms of readability and simplicity. This makes the code far easier to understand and maintain. There are tools out there to take an unoptimised version and compress and optimise for you (check out Google's closure compiler).

IMO您可以做的最好是在可读性和简单性方面进行“优化”。这使代码更容易理解和维护。有一些工具可以为您提供未经优化的版本并进行压缩和优化(请查看Google的闭包编译器)。

#3


4  

The .ready() method is typically used with an anonymous function:

.ready()方法通常与匿名函数一起使用:

$(document).ready(function() {
  // Handler for .ready() called.
});

Which is equivalent to calling:

这相当于调用:

$(function() {
 // Handler for .ready() called.
});

As can be read here

可以在这里阅读

#4


2  

Yes, $( function() { and $(document).ready are same.

是的,$(function(){和$(document).ready是一样的。

$( function() { works as a shorthand syntax but $(document).ready makes the code more readable.

$(function(){作为简写语法,但$(document).ready使代码更具可读性。

#5


1  

note that you can also find scripts like this:

请注意,您还可以找到这样的脚本:

jQuery(document).ready(function(){

here the $-sign is replace by jQuery to avoid conflicts with other library's

这里$ -sign被jQuery取代,以避免与其他库的冲突

http://docs.jquery.com/Using_jQuery_with_Other_Libraries

#6


1  

Here is a pretty safe way to run code on ready

这是一个非常安全的方法来准备好运行代码

jQuery(function($, undefined){
  // code to run onready
});

Although I personally prefer doing it like this:

虽然我个人更喜欢这样做:

(function($){ // create scope and pass specific aliased variables

    $(function($, undefined){ // attach callback to run onready
       // code to run onready
    });

})(jQuery);

This way you can make your own bundles of functionality without fear of breaking other peoples code or having your code broken by loose variable definitions. You can also call the variables that you pass along with whatever names that you want and have code that runs no on ready, for example.

这样,您就可以创建自己的功能包,而不必担心破坏其他人的代码或者使用松散的变量定义来破坏代码。例如,您还可以调用您传递的变量以及您想要的任何名称,并使代码在准备就绪时不运行。

(function($){ // create scope and pass specific aliased variables


    $(document).on('click', 'a[href]', function(){
       // code to run when a link is clicked
    });
    $(window).on('load',function(){
       // code to run onload
    });
    $(function($, undefined){ // attach callback to run onready
       // code to run onready
    });


})(jQuery);

Note that these are the same

请注意,这些是相同的

$(document).bind('ready', function(){});
$(document).on('ready', function(){});
$(document).ready(function(){});
$(function(){});

And that document does not have a load event

该文档没有加载事件

$(document).on('load', function(){}); // will not work

#7


-1  

Are you using jQuerymobile? if so instead of using document ready use

你在使用jQuerymobile吗?如果是这样,而不是使用文档就绪使用

$('#pageId').live('pageinit',function(){});

#1


22  

See the extract below from http://api.jquery.com/ready/

请参阅http://api.jquery.com/ready/中的摘录

All three of the following syntaxes are equivalent:

以下所有三种语法都是等效的:

  • $(document).ready(handler)
  • $().ready(handler) (this is not recommended)
  • $()。ready(处理程序)(不建议这样做)

  • $(handler)

#2


4  

Yes, it's a shorthand version of the same thing. The $ function calls the $(document).ready function when passed a function as an argument.

是的,它是同一件事的速记版本。当函数作为参数传递时,$函数调用$(document).ready函数。

If you're trying to optimise in terms of speed - both will perform pretty much equivalently, however the longer $(document).ready(handler) will be minimally faster if executed lots of times.

如果你试图在速度方面进行优化 - 两者都会表现得非常相似,但是如果执行很多次,那么更长的$(document).ready(handler)会更快。

If you're trying to optimise in terms of file size - use a minifier.

如果您正在尝试优化文件大小 - 请使用缩小器。

IMO the best you can do is to 'optimise' in terms of readability and simplicity. This makes the code far easier to understand and maintain. There are tools out there to take an unoptimised version and compress and optimise for you (check out Google's closure compiler).

IMO您可以做的最好是在可读性和简单性方面进行“优化”。这使代码更容易理解和维护。有一些工具可以为您提供未经优化的版本并进行压缩和优化(请查看Google的闭包编译器)。

#3


4  

The .ready() method is typically used with an anonymous function:

.ready()方法通常与匿名函数一起使用:

$(document).ready(function() {
  // Handler for .ready() called.
});

Which is equivalent to calling:

这相当于调用:

$(function() {
 // Handler for .ready() called.
});

As can be read here

可以在这里阅读

#4


2  

Yes, $( function() { and $(document).ready are same.

是的,$(function(){和$(document).ready是一样的。

$( function() { works as a shorthand syntax but $(document).ready makes the code more readable.

$(function(){作为简写语法,但$(document).ready使代码更具可读性。

#5


1  

note that you can also find scripts like this:

请注意,您还可以找到这样的脚本:

jQuery(document).ready(function(){

here the $-sign is replace by jQuery to avoid conflicts with other library's

这里$ -sign被jQuery取代,以避免与其他库的冲突

http://docs.jquery.com/Using_jQuery_with_Other_Libraries

#6


1  

Here is a pretty safe way to run code on ready

这是一个非常安全的方法来准备好运行代码

jQuery(function($, undefined){
  // code to run onready
});

Although I personally prefer doing it like this:

虽然我个人更喜欢这样做:

(function($){ // create scope and pass specific aliased variables

    $(function($, undefined){ // attach callback to run onready
       // code to run onready
    });

})(jQuery);

This way you can make your own bundles of functionality without fear of breaking other peoples code or having your code broken by loose variable definitions. You can also call the variables that you pass along with whatever names that you want and have code that runs no on ready, for example.

这样,您就可以创建自己的功能包,而不必担心破坏其他人的代码或者使用松散的变量定义来破坏代码。例如,您还可以调用您传递的变量以及您想要的任何名称,并使代码在准备就绪时不运行。

(function($){ // create scope and pass specific aliased variables


    $(document).on('click', 'a[href]', function(){
       // code to run when a link is clicked
    });
    $(window).on('load',function(){
       // code to run onload
    });
    $(function($, undefined){ // attach callback to run onready
       // code to run onready
    });


})(jQuery);

Note that these are the same

请注意,这些是相同的

$(document).bind('ready', function(){});
$(document).on('ready', function(){});
$(document).ready(function(){});
$(function(){});

And that document does not have a load event

该文档没有加载事件

$(document).on('load', function(){}); // will not work

#7


-1  

Are you using jQuerymobile? if so instead of using document ready use

你在使用jQuerymobile吗?如果是这样,而不是使用文档就绪使用

$('#pageId').live('pageinit',function(){});