Javascript 如何使用ajax、jquery和php制作类似facebook的聊天盒

Javascript 如何使用ajax、jquery和php制作类似facebook的聊天盒,javascript,php,jquery,ajax,Javascript,Php,Jquery,Ajax,看,我几乎只做了两个问题的聊天框。我不知道如何解决它们。我正在尝试无望的方法来纠正它,但它就是不起作用。我将在下面解释我的代码。。。 这里是HTML部分,其中包含聊天框、聊天文本区域和聊天成员。 我想做的是在左侧有一些聊天成员列表。如果我点击聊天室成员的任何姓名,与此人相关的聊天室就会打开。也就是说,它是登录用户和其中一个聊天成员之间的一对一聊天。聊天室成员基本上是登录用户的恶魔 <div id="chat_box"> </div> <div id="input_c

看,我几乎只做了两个问题的聊天框。我不知道如何解决它们。我正在尝试无望的方法来纠正它,但它就是不起作用。我将在下面解释我的代码。。。 这里是HTML部分,其中包含聊天框、聊天文本区域和聊天成员。 我想做的是在左侧有一些聊天成员列表。如果我点击聊天室成员的任何姓名,与此人相关的聊天室就会打开。也就是说,它是登录用户和其中一个聊天成员之间的一对一聊天。聊天室成员基本上是登录用户的恶魔

<div id="chat_box">
</div>
<div id="input_chat">
    <input type="text" id="input_ur_chat" placeholder="Press ENTER After Writing" name="chat_msg" />
</div>
<div style="background-color:black; position:absolute; height:100%; width:25%; opacity:0.8;">
    <div id="chat_members">
<p id='1' class='chat_members_list'>anurag</p>
<p id='2' class='chat_members_list'>golu</p>
<p id='3' class='chat_members_list'>akash</p>
    </div>
</div>
在div chat_members中,id表示该用户的userid,它是数据库中唯一标识该用户的属性值

现在,我的聊天室ajax和jquery代码如下:

这是我的php代码

现在我来告诉你我的问题

首先,当我单击聊天室成员时,与该成员相关的聊天室将打开。在输入字段中输入任何值时,只插入一行。即使在刷新页面并重试后,也只插入一行。问题可能是脚本开始时的单击事件。因为ajax请求只有在click事件发生时才会启动。这就是问题所在。我只想为每个成员点击一次,然后他们就可以聊天了。还有一个问题是,当我刷新页面并再次使用该单击事件与其中一个成员开始聊天时,由于刷新前插入了一行,因此没有插入新行。我不知道这个问题的根源。
我希望你现在能理解我的问题。如果您需要更多信息,请告诉我并帮助我。

我认为keyup事件应该与click事件分开。 这应该是一个单独的事件

$('.chat_members_list').click(function(){
    //code
});
而这也应该是一个单独的事件

$("#input_ur_chat").keyup(function(evt){
    //code
});

您可能需要检查套接字,例如。这有点难,但这正是你要找的。套接字稍微复杂一点,但速度非常快。您可以使用AJAX实现这一点,但AJAX与套接字相比速度非常慢

在onMessage事件中,向所有连接的用户广播消息,使用onConnect和onDisconnect向所有人广播连接的用户列表

$('.chat_members_list').click(function(){
    //code
});
$("#input_ur_chat").keyup(function(evt){
    //code
});