javascript - jQueryは、別のクラスがクリックされたときに1つのクラスを切り替えます

Question

1 つのクラスの marginTop が -200px であるという条件の下で別のクラスがクリックされたときに、あるクラスをトリガーする if else ステートメントを作成しようとしています。

このifステートメントを使用してみましたが、うまくいきません:

    if ($('.logintrigger').click() && $('.register').css('marginTop') === '-200px') {
        $('.registertrigger').toggle(
            function () {$('.register').stop().animate({'marginTop':'-0px'},200); $('#opencloseregister').css({'backgroundPosition':'-20px 0px'});}
        );
    }

助言がありますか？？？

Answer 1

jqueryを使用した適切なifelseの例を使用してjsfiddleを作成しました。http://jsfiddle.net/RQ75m/

$(".logintrigger").click(function(){

    if( $(".register").css("margin-top") == "200px" ){

       $(".registertrigger").show(); //toggle function here
       return false; //so that the page doesn't refresh

    } else {

       $(".registertrigger").hide();
       return false; //so that the page doesn't refresh

    }

});​

Answer 2

表現を修正する必要があるようです。問題は、イベント ハンドラーをアタッチする必要があるときに、要素が「クリック」されたかどうかを確認しようとしていることです。

$('.loginTrigger').click(function()
{
    if('.register').css('marginTop') === '-200px')
    {
        // Do Stuff
    }
});

Answer 3

クリックイベントを呼び出していますが、クリックイベントにイベントを追加したいと思います...

$('.logintrigger').click( function(e){
  if($('.register').css('marginTop') === '-200px'){
    $('.registertrigger').toggle();
  }
});

Answer 4

を呼び出すと$('.logintrigger').click()、クリックイベントがトリガーされます。そのはず：

if ($('.logintrigger').click(function(){
   if ($('.register').css('marginTop') === '-200px') {
        $('.registertrigger').toggle(
            function () {
               $('.register').stop().animate({'marginTop':'-0px'},200);
               $('#opencloseregister').css({'backgroundPosition':'-20px 0px'});
            }
        );
    }
})

Answer 5

$('.logintrigger').on('click', function(){

    if($('.register').css('marginTop')==='200px') {

        $('.registertrigger').toggle( function () {

            $('.register').stop().animate({'marginTop': 0 },200);
            $('#opencloseregister').css({'backgroundPosition':'-20px 0px'});

        });

    }

});