用户之间的聊天系统

时间:2017-10-31 15:48:27

标签: php mysql ajax

我一直在尝试使用php + ajax + mysql创建一个聊天系统。

<?php
  session_start();
?>
<html>  
  <head>  
       <title>Live Table Data Edit</title>  
       <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />  
       <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>  
       <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>  
  </head>  
  <body>  
       <div class="container">  
            <br />  
            <br />  
            <br />  
            <div class="table-responsive">  
                 <h3 align="center">You Are : <?php echo $_SESSION['name']; 
                ?></h3><br />  
                 <div id="live_data"></div>                 
            </div>  
            <div id="messages"></div> 
            <div class="area" style="display:none">
            <textarea id="text" name="text"></textarea>
            <input type="submit" id="sub" name="sub" value="Send" />
            </div>
       </div>  

  </body>  
  </html>  

   <script>  
$(document).ready(function() {
  function fetch_data() {
    $.ajax({
      url: "select.php",
      method: "POST",
      success: function(data) {
        $('#live_data').html(data);
      }
    });
  }
  fetch_data();

  $(document).on('click', '.first_name', function() {
    var id = $(this).data("id1");

    function fetch_chat() {
      $.ajax({
        url: "fetch_chat.php",
        method: "POST",
        data: {
          id: id
        },
        dataType: "text",
        success: function(data) {
          $('#messages').html(data);
          $("div.area").show();
        }

      });
    }

    fetch_chat();
    $("#sub").click(function() {
      var text = $("#text").val();
      $.post('insert_chat.php', {
        id: id,
        msg: text
      }, function(data) {
        $("#messages").append(data);
        $("#text").val('');

      });
      alert(text);
    });
  });
});

但问题是,当我尝试在mysql中插入新消息时,消息将发送给我点击过的所有用户。

fetch_chat.php

<html>
<head>
</head>
<body>
<?php
session_start();
$con=mysqli_connect('localhost','root','','test');
$id= $_POST['id'];
$sql="select * from users where id='$id'";
$res=mysqli_query($con,$sql);
$row=mysqli_fetch_array($res);
$user_to= $row['name'];
$sql1="select * from chats where user_from='$_SESSION[name]' AND 
user_to='$user_to' OR user_to='$_SESSION[name]' AND user_from='$user_to' 
order  by id";
$res1=mysqli_query($con,$sql1);
if(mysqli_num_rows($res1)>0){
    while($row=mysqli_fetch_array($res1)){
?>
        <b> <?php echo $row['user_from']; ?>:</b> 
        <?php echo $row['msg']; ?><br /><br />
        <?php
    }
}
else
    echo "No msgs <br />";
?>

</body>
</html>

和insert_chat.php是:

<html>
<head>
</head>
<body>
<?php
session_start();
$con=mysqli_connect('localhost','root','','test');
$id= $_POST['id'];
$msg=$_POST['msg'];
$sql="select * from users where id='$id'";
$res=mysqli_query($con,$sql);
$row=mysqli_fetch_array($res);
$user_to= $row['name'];

$sql1="insert into chats(user_from,user_to,msg) 
values('$_SESSION[name]','$user_to','$msg')";
$res1=mysqli_query($con,$sql1);
if($res1){
?>
    <b> <?php echo $_SESSION['name']; ?>:</b> 
    <?php echo $msg; ?><br /><br />
<?php   
}
?>
</body>
</html>

我不知道自己哪里出错了。请帮帮我。

例如,用户列表是:

(1)用户a

(2)用户b

(3)用户c

首先,我点击a,然后我改变主意选择b并发送文字。但是出现了问题:a和b都插入了数据,就像我同时发短信一样。

1 个答案:

答案 0 :(得分:0)

您继续添加越来越多的&#34;点击&#34;事件处理程序到&#34; sub&#34;,每次点击&#34; first_name&#34;。因此,每次再次单击sub时,它会一次又一次地运行所有先前的事件处理程序。因此,您获取当前消息,但发送给您在加载页面后之前单击的所有用户。

$("#sub").off("click").on("click", function() { 

需要

IndexAnnotation.AnnotationName

以便在使用新数据定义新版本之前删除以前的处理程序。