0

タブをクリックすると開くメニューがあり、閲覧者がウェブページのどこかをクリックするとメニューが再び閉じるようにしました。ただし、Web ページのどこをクリックしてもメニューが開きます。タブをクリックするだけでメニューが開き、タブまたは他の場所をクリックするとメニューが閉じるようにするにはどうすればよいですか?

これは私が持っているものです:

<script type="text/javascript">
    $(document).ready(function(){
        $("#bodyw2").click(function(){
            $(".panel").toggle("fast");
            $(".trigger").toggleClass("active");    
            return true;
        });
    });

    $(document).ready(function(){
        $(".trigger").click(function(){
            $(".panel").toggle("fast");
            $(this).toggleClass("active");  
            return false;
        });
    });
</script>

私が話していることに関して他に質問がある場合は、私のウェブサイトはhttp://www.drippydenton.net/です。

4

2 に答える 2

4

hide()の代わりに body click event .. の内部を使用しますtoggle()

  $(document).ready(function(){
   $("#bodyw2").click(function(){
      $(".panel").hide("fast");
      $(".trigger").removeClass("active");

      return true;
   });
    $(".trigger").click(function(){
      $(".panel").toggle("fast");
      $(this).toggleClass("active");

      return false;
    });
 });

2 つの document.ready 関数は必要ありません... 1 つの document.ready 関数内にすべてのコードを追加します

于 2013-09-04T07:14:52.063 に答える
0

これを行う最も簡単な方法は、本文のクリック イベントをバインドおよびバインド解除することです。コードは次のようになります。

$(document).ready(function(){
    $(".trigger").click(function(){
        $(".panel").toggle("fast");
        $(this).toggleClass("active");

        $("#bodyw2").click(function(){
            $(".panel").toggle("fast");
            $(".trigger").toggleClass("active");
            $("#bodyw2").unbind('click');
            return true;
        });

        return false;
    });
});
于 2013-09-04T07:25:53.847 に答える