php - 每次点击时 JQuery 备用 div 内容和 AJAX 帖子 url

Question

我有一些处理 div 点击的 JQuery。如果 div 被单击，它会隐藏自己并显示另一个 div（并在后台发布到 php 脚本）。如果再次单击它，它应该隐藏新的 div，再次显示新的 div，并将更多数据发布到不同的脚本，等等。

它第一次更改（.f 隐藏，.uf 显示）但是当我单击“.uf”时没有任何反应。

查询：

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>

Answer 1

如果您打算使用选择器两次，请使用一个类，并且不要两次编写相同的代码，除非您必须：

$('.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();
    });
});