Question

我的帖子具有唯一ID，如果作者登录或实时注销（无需刷新），则每个帖子都会变为绿色/灰色。

当帖子是绿色的（作者在线）时，我希望它的链接指向用户一个javascript函数，它将获取帖子ID，标题等。

当帖子为灰色时，链接应该将用户引导到帖子本身，这意味着它必须以某种方式获得帖子的$ id。

我的问题是我的所有php变量都设置好并且工作得很好，如果它不是实时的，但如果我想实时，我怎样才能将这些变量传递给ajax代码，以便它动态变化？另外，我怎样才能使整个div成为一个链接而不仅仅是div中的文本？

主页

  $res = mysql_query("SELECT * FROM `posts` ORDER BY `date` DESC LIMIT 10");
        if($res && mysql_num_rows($res) > 0){
            while($row = mysql_fetch_assoc($res)){
                $id = $row['id'];
                $user_id = $row['user_id'];
                $title = $row['title'];
            echo '<div class="status" id="user'.$user_id.'">'.$title.'</div>';
         }
    }

AJAX

    $(document).ready(function() {      
        setInterval(function(){
            $.ajax({
                url: 'status.php', //get online users
                dataType: "json",
                type: 'GET',
                success: function(data) {
                       if (data.length > 0){    // if at least 1 is online
                        $('.status').each(function(){                   // loop through each of the user posts                      
                        var userid = $(this).attr('id'); // get the user#
                        if($.inArray(userid, data) !== -1){  // if userid # in the returned data array set to online
                            $(this).css({background: '#40A547'}); 
                            $(this).wrapInner("<a href='javascript:void(0)' onclick='chatWith('.$id.')'></a>"); //call function for $id
                        } else{     // if not, set to offline
                            $(this).css({background: '#7f8c8d'});
                            $(this).wrapInner("<a href='post.php?id='></a>"); //take to post itself
                        }
                    });
                } else {    // if no one is online, set all to offline
                    $('.status').css({background: '#7f8c8d'});
                    $(this).wrapInner("<a href='post.php?id='></a>");
                }           
            }
        });
    }, 2000); //just for testing
 });

非常感谢所有帮助！

Answer 1

我会这样做。

（1）将帖子id添加到div，即。 data-postid="$id"

主页

$res = mysql_query("SELECT * FROM `posts` ORDER BY `date` DESC LIMIT 10");
    if($res && mysql_num_rows($res) > 0){
        while($row = mysql_fetch_assoc($res)){
            $id = $row['id'];
            $user_id = $row['user_id'];
            $title = $row['title'];
        // add the $id to the div - ie. data-postid="$id"
        echo '<div class="status" id="user'.$user_id.'" data-postid='.$id.'" >'.$title.'</div>';
     }
}

（2）在ajax中，我只使用.addClass()向在线人员添加$(this).wrapInner()课程，而不是使用online，并将其删除离线使用.removeClass()

<强>的Ajax

$(document).ready(function() {      
    setInterval(function(){
        $.ajax({
            url: 'status.php', //get online users
            dataType: "json",
            type: 'GET',
            success: function(data) {
                   if (data.length > 0){    // if at least 1 is online
                    $('.status').each(function(){                   // loop through each of the user posts                      
                      var userid = $(this).attr('id'); // get the user#
                      if($.inArray(userid, data) !== -1){  // if userid # in the returned data array set to online
                        $(this).css({background: '#40A547'});
                        $(this).addClass('online'); 
                      } else{     // if not, set to offline
                        $(this).css({background: '#7f8c8d'});
                        $(this).removeClass('online');
                      }
                    });
                   } else {    // if no one is online, set all to offline
                    $('.status').css({background: '#7f8c8d'});
                    $(this).removeClass('online');
                   }           
            }
        });
    }, 2000); //just for testing
});

（3）绑定.status div上的任何点击，获取帖子ID，获取帖子是否有.online类，然后确定链接样式。（注意：在$(document).ready(function() {

之后的setInterval(function(){内添加此内容

$(document).ready(function() {
setInterval(function(){
 ...
}, 2000);

// Bind to any click on a post div
$('.status').click(function(){

    // get the post id
    var postid = $(this).data('postid');

    // check if post has '.online' class
    if($(this).hasClass('online')){

       // if online
       chatWith(postid);
    }
    else {

       // if offline
       window.location.href = 'post.php?id='+postid;
    }

});

});

这是一个jsFiddle（它使用id警告链接/函数） - http://jsfiddle.net/f5xkZ/5/

根据帖子的作者状态实时添加指向div的链接

1 个答案: