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()ハンドラーがヘッドで指定されている場合、セレクターは要素を返しません。

ボディタグの最後に移動してみましたが、すべて正常に動作します。JQueryのドキュメントによると、ハンドラーが呼び出される前に、DOM全体とすべての画像とリソースが読み込まれることになっています。何が得られますか?

  • Linuxx86上のFirefox16.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 に答える