0

div クリックを処理する JQuery があります。div が一度クリックされると、それ自体が非表示になり、別の div が表示されます (そして、バックグラウンドで php スクリプトに投稿されます)。その後もう一度クリックすると、新しい div が非表示になり、新しい div が再び表示され、さらにデータが別のスクリプトに投稿されます。

最初は変更されますが (.f が非表示になり、.uf が表示されます)、'.uf' をクリックしても何も起こりません。

JQuery:

if($('.f').is(":visible")) {
    $('#follow').click(function() {
        var to_follow = $('.name').attr('id');
        $.ajax({  
            type: "POST",  
            url: "/bin/rel_p.php",  
            data: "y=" + to_follow,  
            success: function() {  
                $('.f').hide();
                $('.uf').show();
            }
        });
    });
}
else {
    $('#follow').click(function() {
        var to_unfollow = $('.name').attr('id');
        $.ajax({  
            type: "POST",  
            url: "/bin/relu_p.php",  
            data: "y=" + to_follow,  
            success: function() {  
                $('.uf').hide();
                $('.f').show();
            }
        });
    });
}

HTML:

            <div id="follow" class="f">
                <img src="img/icons/Follow.png">
                <h1>Follow</h1>
            </div>
            <div id="follow" class="uf" style="display:none;">
                <img src="img/icons/Unfollow.png">
                <h1>Unfollow</h1>
            </div>
4

1 に答える 1

1

セレクターを 2 回使用する場合はクラスを使用し、次の必要がない限り、同じコードを 2 回記述しないでください。

$('.follow').on('click', function() {
    var is_f = $('.f').is(":visible"),
        to_follow = $('.name').attr('id'),
        give_me_an_u = is_f?'':'u';
    $.ajax({  
        type: "POST",  
        url: "/bin/rel" + give_me_an_u + "_p.php",  
        data: {y : to_follow}
    }).done(function() {
        $('.f, .uf').toggle();
    });
});
于 2012-11-05T22:43:16.343 に答える