PHP+Mysql+Ajax实现淘宝客服或阿里旺旺聊天功能(前台页面)

php  /  管理员 发布于 7年前   238

首先来看一下我已经实现的效果图：

消费者页面：（本篇随笔）

（1）会显示店主的头像

（2）当前用户发送信息显示在右侧，接受的信息，显示在左侧

店主或客服页面：（下一篇随笔）

（1）在左侧有一个列表 ，会显示所有与店主对话的顾客；该列表可以移动；有新消息时会提示；也可以清空该聊天记录

（2）点击列表里的顾客进入右边的对话框界面，显示与该顾客的聊天信息

 在实现功能之前，来说一下我用到的两张表：

 解释一下：bkid在此处没有用到；isok列是用来判断消息是否已读，未读为0；

现在，来说一下步骤：（分前台和后台两部分）

在这篇随笔中我们首先来说一下前台页面是如何实现的：（李四登录）

用session存取一下lisi;便于后面从user表中取数据

1、布局页面代码以及读取数据代码：

 
  
   
    
  //取店主用户名，显示店主的头像和姓名
　　　　　　　　query($sql);   foreach($arr as $v)   {       echo "   
    
    
    
     亲爱的店主
个性签名：             ";    }      ?>      

         //获取session里存取的uid;    query($sql3);
　　　　　　　　　　　　　　　　　　　　//从对话表里读取店主张三和李四所有的对话信息，并按对话时间顺序排序     $sql2="select * from duihua where uid='{$uid}' or jsid='{$uid}' order by dhtime";          $arr2= $db->query($sql2);     foreach($arr2 as $n)     {
        //如果是店主，则信息要显示在左侧     if($n[2]=='zhangsan')     {     echo "
     
      
        {$n[6]}      
       
   
       
        {$n[4]}
";     } 
//如果是李四，则显示在右侧         if($n[2]==$uid)     {     echo "
     
      
        {$n[6]}      
       
   
       
        {$n[4]}
";      }   }       ?>
  
   
    //输入发送内容       
  发送  //点击按钮发送           　　

实现效果：

2、点击发送时的ajax代码：

　3、qt-speak-cl.php页面：

query($sql,0);}else{  echo "发送内容不能为空！";}?>

　如果发送内容为空，则会提示“发送内容不能为空！”

前台页面会随不同用户登录显示不同的信息；让王五登录看看：

以上所述是小编给大家介绍的PHP+Mysql+Ajax实现淘宝客服或阿里旺旺聊天功能(前台页面)，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对站的支持！

您可能感兴趣的文章:

• 反向Ajax 30分钟快速掌握
• 基于PHP技术开发客服工单系统
• php 微信公众平台开发模式实现多客服的实例代码
• PHP+jquery+ajax实现即时聊天功能实例
• 发布一个迷你php+AJAX聊天程序[聊天室]提供下载
• Ajax PHP JavaScript MySQL实现简易无刷新在线聊天室
• 值得分享的php+ajax实时聊天室
• PHP+mysql+ajax轻量级聊天室实现方法详解
• 基于javascript、ajax、memcache和PHP实现的简易在线聊天室
• PHP使用反向Ajax技术实现在线客服系统详解