0

我制作了一个小页面,其中包含 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 标签的末尾,一切正常。根据JQuery 文档,整个 DOM 以及所有图像和资源都应该在调用处理程序之前加载。是什么赋予了?

  • Linux x86 上的 Firefox 16.0.2
  • jQuery 1.8.2
  • JQuery UI 1.9.2(这里没有真正使用)
4

1 回答 1

7

因为你正在调用你的函数!

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

你想给它分配一个引用

$(main);  <-- no ()!
于 2012-11-16T02:11:38.160 回答