2

所以我在 jquery-ui 文档中看到了这段代码,我想知道为什么所有的语句都包含在$(function() {...});

jquery 文档说$()增强了其中的对象,但我不明白为什么我们需要它。这是一个约定还是真的有意义?

<script>
$(function() {
    $( "#draggable" ).draggable();
    $( "#droppable" ).droppable({
        drop: function( event, ui ) {
            $( this )
                .addClass( "ui-state-highlight" )
                .find( "p" )
                    .html( "Dropped!" );
        }
    });
});
</script>
4

3 回答 3

5

$(function() {});就所有意图和目的而言,与$(document).ready(function() {});; 虽然我相信它在文件准备好之前就被调用了。

它的作用是在文档创建完成后调用函数内的代码。这就是函数加载时所有的 DOM 树都已创建。这允许您在知道那些对象将在那时创建的情况下安全地操作 DOM。

这是一个例子:

<script>
//This code is called straight away, your DOM hierarchy may not
//be complete and the object #draggable may not have been created yet,
//as such draggable() may not work properly.
$( "#draggable" ).draggable();

//This code is called once the DOM tree is complete,
//as such you know all your objects have been created
$(function() {
    $( "#draggable" ).draggable();
    $( "#droppable" ).droppable({
        drop: function( event, ui ) {
            $( this )
                .addClass( "ui-state-highlight" )
                .find( "p" )
                    .html( "Dropped!" );
        }
    });
});
</script>

有关更详尽的解释,请参阅jQuery 文档

于 2012-08-02T14:53:10.843 回答
3

这是一个简写$(document).ready(function() {})

它在整个文档加载后执行,而不是在解析期间遇到它时执行。

于 2012-08-02T14:53:20.470 回答
2

它还为其语句块中的项目创建一个上下文,这与 $(document).ready(function() {}) 一样重要,文档准备就绪。

于 2012-08-02T14:57:36.273 回答