jQueryのクリック機能が機能しないのはなぜですか？

<script> 
$("#btn1").click(function() { 
    $("#logpop").hide("slow"); 
    }); 

    </script> 
<body> 

<div id="logpop"> 
    <div class="logpop_box"> 
    <div class="form"> 
    <input class="input_box" name="email" type="text" placeholder="Woosuk"/>         <br/><br/> 
    <input class="input_box" name="pass" type="password" placeholder="******"/> <br/> 
    <button id="btn1">Login</button> 

    </div> 
    </div> 
</div>

ボタンをクリックするとdivが消えてしまいます。しかしそれは消えません。はどれjQueryのクリック機能が機能しないのはなぜですか？

出典

2012-02-16 draford

あなたのスクリプトを 'btn1'要素の後ろに置いて、まだ' 'の中に入れておけばうまくいきます。閉じた ''タグの直前にスクリプトを置くことを望む人もいます。 –

あなたのJavaScriptが文書レディ機能であることが必要であると思った：DOMが作成された前

$(document).ready(function() { 
    $("#btn1").click(function() { 
    $("#logpop").hide("slow"); 
    }); 
});

現在、あなたのクリックハンドラは、このようにそれを取付けることができない、実行されています。要素が存在する前に

$(function(){ 
    $("#btn1").click(...); 
});

あなたのスクリプトが実行されている、ので、何のクリックハンドラが登録されていない：

出典

2012-02-16 00:36:55 Jivings

ありがとうございます – draford

問題ありません。回答としてマークすることを忘れないでください。 – Jivings

あなたは、ドキュメント・レディブロック内あなたのクリックハンドラを登録する必要があります。

出典

2012-02-16 00:37:10

ありがとう – draford

さらに、他の回答によると、ブラウザがインラインJavaScriptをソースドキュメントを解析する際に表示される順序で実行するため、まだ解析されていない要素は選択できません。あなたのコードが実行されても、要素は解析されません。

$(document).ready()ハンドラにコードを入れて（または古い学校onloadイベントハンドラを使用）：この問題を回避するには、2つの方法があります。
スクリプトブロックをに移動し、が参照しようとしている要素の後に移動します。ほとんどの人は、ドキュメントの途中でスクリプトブロックが厄介であることを知っているので、（絶対的に必要な場合を除いて）私は最後に</body>タグの前に置くことをお勧めします。

出典

2012-02-16 00:43:44 nnnnnn

jQueryのクリック機能が機能しないのはなぜですか？

答えて

関連する問題