2

メニューがあり、クリックメニューとして機能するはずなので、ボタンをクリックするとメニューが表示され、ボタンをもう一度クリックするとメニューが消えるはずですが、機能しませんか?

私はこのスクリプトを持っています

<script type="text/javascript">
      $(document).ready(function() { 
        $('#dropdown').click(function(){
            setTimeout(function(){
                $('#dropdown').attr("id", "dropdown2");
                $('#dropmenu').addClass("open");
                //$('#dropmenu').fadeIn('fast');
            },500);
        })
        $('#dropdown2').click(function(){
            setTimeout(function(){
                $('#dropdown').attr("id", "dropdown");
                $('#dropmenu').removeClass("open");
                //$('#dropmenu').fadeIn('fast');
            },500);
        })
      });
    </script>

クラスを追加するときに機能しますが、ボタンをもう一度クリックすると、「開く」クラスが削除されません

4

3 に答える 3

7

を記述した後、2 番目のハンドラのコードが一致する要素$('#dropdown').attr("id", "dropdown2");はありません。 また、2 番目のハンドラーをバインドすると、要素はまだありません。（イベントはその問題を解決します）#dropdown
#dropdown2live

代わりに、toggleイベントclickを使用する必要があります。これにより、 1 回おきのクリックを実行する複数のハンドラーをバインドできます。

例えば：

$(document).ready(function() { 
    $('#dropdown').toggle(
        function() {
            setTimeout(function(){
                $('#dropdown').addClass("open")
                              .fadeIn('fast');
            }, 500);
        },
        function() {
            setTimeout(function(){
                $('#dropdown').removeClass("open")
                              .fadeOut('fast');
            }, 500);
        }
    );
});
于 2011-03-31T13:08:19.960 に答える
2

機能しない理由は、クリック ハンドラーを登録するときに dropdown2 id が終了しないためです。これを克服するために to live を使用できますが、クラスを使用することをお勧めします。

  $(document).ready(function() { 
    $('#dropdown').click(function(){
        if (!$(this).hasClass("open")) {
          setTimeout(function(){
              $('#dropmenu').addClass("open");
             //$('#dropmenu').fadeIn('fast');
          },500);
       } else {
        setTimeout(function(){
            $('#dropmenu').removeClass("open");
            //$('#dropmenu').fadeIn('fast');
        },500);
      }
    })
  });
于 2011-03-31T13:12:54.670 に答える
0

上記のコードを更新しましたが、うまくいきました。これを試してください、

$(document).ready(function(){  
    $("#loginlink").click(function(){
        $('.container .col-sm-6 ul li .dropdown-menu').first().toggle(
            function() {
                setTimeout(function(){
                    $('.container .col-sm-6 ul li').first().addClass("open").fadeIn('fast');
                });
            }
        );
        if(("#loginformstarthere").length){ 
            $(".container .col-sm-6 ul li .dropdown-menu").first().append( "hello");
    }

});
于 2016-06-27T05:23:55.440 に答える