Question

我试图制作一个“关注”按钮，但返回的数据，即“取消关注”按钮，无效。

$('.follow_button').click(function() {
    //event.preventDefault();
    var visitor_user_id = $('.follow_button').attr('id');

    $('#link_visitor_follow').empty().append('<div id = "follow_jquery_btn"><img src = "css/images/ajax_follow.gif" width = "12" height = "12" /> Follow</div>');
    $.post('/unime/user_follow.php', {'type':'follow_me', visitor_user_id:visitor_user_id}, function(data){
        if(data){
            $('#link_visitor_follow').empty().html(data);
        }
    });
    return false;
});

$('.unfollow_button').click(function() {
    //event.preventDefault();
    var visitor_user_id = $('.unfollow_button').attr('id');
    $('#link_visitor_unfollow').empty().append('<div id = "follow_jquery_btn"><img src = "css/images/ajax_follow.gif" width = "12" height = "12" /> Following</div>');
    $.post('/unime/user_follow.php', {'type':'unfollow_me', visitor_user_id:visitor_user_id}, function(data){
        if(data){
            $('#link_visitor_unfollow').empty().html(data);
        }
    });
        return false;
});

PHP返回数据：

echo "<a class = 'unfollow_button' id = 'visitor_".$visitor_user_id."'><span id = 'check_mark'></span> Unfollow</a>";

当我单击取消关注按钮时，它不起作用，虽然我已经为它设置了代码。 PHP本身没有任何问题。当我点击取消关注时，它甚至没有调用Ajax。

Answer 1

您只能绑定到当前存在的元素。如果他们不这样做，则需要委托将存在的元素。

变化：

$('.unfollow_button').click(function() {

要：

$('#link_visitor_follow').on('click', '.unfollow_button', function() {

它会将点击委托给尚未存在的元素，事件将从取消关注按钮冒出来，直到它到达具有事件绑定的link_visitor_follow，并且由于它来自取消关注按钮，它现在将调用该事件（如果有道理）。

此外，您需要对关注按钮执行相同操作，以防他们关注，取消关注，然后再次关注。

Answer 2

Dave回答应该足以满足您的问题，但如果您使用的是1.7以下的jQuery，您可以试试这些;

$('.unfollow_button').live('click', function() {

   //your code here

})

$ .Post第二次不开火

2 个答案: