Question

我创建了一个小页面，只有HTML格式：

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">

<title>hi</title>

<script type="text/javascript" src="js/jquery-1.8.2.js"></script>
<link type="text/css" href="js/jquery-ui-1.9.1.custom/css/black-tie/jquery-ui-1.9.1.custom.css" rel="Stylesheet" />
<script type="text/javascript" src="js/jquery-ui-1.9.1.custom/js/jquery-ui-1.9.1.custom.js"></script>

<link type="text/css" href="css/main.css" rel="Stylesheet" />
<script src="js/main.js"></script>

<script>
    $(main());
/* or $(document).ready(main()); */
</script>
</head>
<body>
<div id="loginDiv" class="popupDiv">
    <div id="usernameDiv">
        <label for="username">username</label>
        <input type="text" id="username"/>
    </div>
    <div id="passwordDiv">
        <label for="password">Password</label>
        <input type="password" id="password"/>
    </div>
</div>

<div id="introDiv">
    <div class="headerDiv">
        <button id="loginButton">Login</button>
    </div>
</div>
</body>
</html>

然后我有了main.js：

function main()
{
    var $loginButton = $('#loginButton');
    var $loginDiv = $('#loginDiv');

    $loginDiv.dialog({ autoOpen: false });

    $loginButton.click(function() {
        $loginDiv.dialog("open");
        //alert('sfsdf');
    });
}

我可以触发警报，但如果在头部指定了.ready（）处理程序，则选择器不会返回任何元素。

我已经尝试将它移动到body标签的末尾，一切正常。根据{{3}}，应该在调用处理程序之前加载整个DOM以及所有图像和资源。是什么给了什么？

Linux x86上的Firefox 16.0.2
JQuery 1.8.2
JQuery UI 1.9.2（此处并未真正用于此目的）

Answer 1

因为你正在调用你的功能！

$(main());   <--() means run it

您想要为其指定参考

$(main);  <-- no ()!

$（document）.ready（）处理程序立即触发

1 个答案: