Question

我还是jQuery的新手，我想知道如何在里面调用jQuery函数.ready（）工作得很好但不在外面？

例如，这可行：

$(document).ready(function() {
    $('#field1').click(function() {
        $('#result').load('/random_post #post');
    });
});

但这不会：

$('#field1').click(function() {
    $('#result').load('/random_post #post');
});

Answer 1

在完全解析文档并构建DOM之前，您无法访问DOM。这包括修改任何元素 - 例如#field1和#result。

由于$(document).ready(..)很长并且可能难以记住，您也可以使用短格式$(onReadyFunction)，即

$(function() {
    $('#field1').click(function() {
        $('#result').load('/random_post #post');
    });
});

顺便说一下，jQuery在这里没有任何魔力：它只是在DOM树的解析和构造触发DOMContentLoaded（或等效）事件时注册要调用的函数。

Answer 2

如何以及是否有效将取决于HTML中布置脚本和元素的顺序，并且它还可能受到控件之外的参数的影响（例如，浏览器的编程方式如何）。

我猜测这个脚本会出现在你的页面之前带有id="field1"的元素，它会添加一个点击处理程序;这会导致脚本运行并在文档树中找不到这样的元素（尚未）。脚本运行后会添加该元素，这就是jQuery在整个文档加载后发现它的原因。

如果您在页面的最后移动此脚本，它应该可以工作（当然，正确的解决方案是使用文档就绪事件，就像在您的第一个代码段中一样）。

Answer 3

在创建dom树时执行ready函数。您在第二段代码中出现错误，因为尚未创建具有id filed1的dom树元素，即页面尚未加载。