jquery - $(document).ready(function(){}) 和 $(document).on ('ready' 、 function(e) 之间的区别

Question

我看到很多项目都在使用

$(document).on('ready', function(e){
 //jquery stuff
})

而不是:

$( document ).ready(function(  ) {
  // Code using $ as usual goes here.
});

或

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

我阅读了完整的api documentation但我不明白第一个示例的使用情况是什么。

对我来说，第一个示例中使用 on 是没有用的。

这些案例之间有什么区别？

Answer 1

功能:

$( document ).ready(function ( ) {
  // Code using $ as usual goes here.
});

翻译为:

$( document ).on( 'ready', function (e) {
 //jquery stuff
})

这与这些简写函数相同:

$( element ).click( function ( ) { } );
$( element ).hover( function ( ) { } );
$( element ).load( function ( ) { } );
$( element ).scroll( function ( ) { } );

来自documentation .click( handler(eventObject) ):

This method is a shortcut for .on( "click", handler ) in the first two variations, and .trigger( "click" ) in the third.

<小时/>

更新答案 - 区别!

There is also $(document).on( "ready", handler ), deprecated as of jQuery 1.8. This behaves similarly to the ready method but if the ready event has already fired and you try to .on( "ready" ) the bound handler will not be executed. Ready handlers bound this way are executed after any bound by the other three methods above.

--Source

更新#2

jQuery(function(){});

也应该被视为更短的替代方案

jQuery(document).ready(function(){});

它确实是首选，因为它不会降低可读性并删除一些字节的字符。