0

私の現在のコードは何をしますか:私はこのHTMLを持っています

 <li>
   <span>Logged in as</span>&nbsp;
   <a class="user" href="#"><?php echo $this->loggedas ?></a>&nbsp;
   <a id="loginarrow" href="javascript: void(0);"></a>
 </li>

これは上記の loginarrow id の私の JS です

 $("#loginarrow").click(function() {
   $("#logindrop").toggle("slow");
   return false;
 });

うまく機能していますが、もう一度クリックして閉じることができます。私はしたくないので、それが開いていて背景をクリックした場合、それを閉じる必要があります。そのために私はそうしました

 $("#loginarrow,body").click(function() {
   $("#logindrop").toggle("slow");
   return false;
 });

今は問題なく動作していますが、別の問題が発生しました。

1 = ページ (本文) に他の多くの html 要素があり、呼び出すイベントが他にもあります。この場合、ページ内の他の要素をクリックするたびに、この div ログイン矢印を切り替えます。

同じ機能が必要ですが、背景だけの他の要素には必要ありません。任意のヒント

4

2 に答える 2

2

見えるときだけ閉じてください。

$("body").click(function() { 
   if ($("#logindrop").is(":visible"))
      $("#logindrop").hide("slow");       
});
于 2012-05-11T11:58:51.223 に答える
1

ブラウザのパフォーマンスを向上させるための基本的な設計原則は、関心のあるイベントのみをキャプチャすることです。

したがって、要素にハンドラーを配置します.click()が、そのハンドラーで、要素を再度閉じる1回限りのイベントハンドラーを#loginarrow登録します。(未テスト) のようなもの:body

$('#loginarrow').click(function() {
    $('#logindrop').show('slow');
    $('body').one('click', function() {
        $('#logindrop').hide('slow');
    });
    return false;
});

これにより、本当に必要な場合を除いて、すべてのクリックを不必要に傍受することがなくなります。body

http://jsfiddle.net/alnitak/vPHaj/を参照してください。

于 2012-05-11T11:59:06.640 に答える