使用jQuery创建信使应用程序(失败）

Creating a messenger app using jQuery (failed)

本文关键字：失败 应用程序 信使 jQuery 创建 使用      更新时间：2023-09-26

我在这里失败了。我是web开发的新手，对HTML/CSS/JS（jQuery）有很好的经验。我试着只使用我所知道的来构建一个聊天应用程序。我把它上传到了一个网络服务器上，发现当其他人在另一台电脑上打字时，其他人也在网站上打字的消息不会出现。我认为让jQuery将元素添加到无序列表中，它会显示给连接到网站的每个人。你认为通过编辑我的一些代码我可以达到我的目标吗？还是我完全偏离了路线，试图做一些不可能的事情（只使用JS/jQuery）。如果是第二个，你能带我朝正确的方向走吗。HTML:

<html>
<head>
<script src="http://www.codehelper.io/api/ips/?js"></script>
<script src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
<script src="js/jQuery.js"></script>
<title>Instant Messenger</title>
</head>
<link rel="stylesheet" href="css/style.css"/>
<body>
    <div class="Talk">
<ul>
</ul>
</div>
<form>
    <div class="Messages">
Message: <input type="text" id="Message" size="100px">
<input type="submit" id="submit">
    </div>
</form>
</body>
</html>

CSS：

@import url("http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,900");

.Messages{
    position: fixed;
    bottom: 10;
}

JS:

$(document).ready(function(){
    $("#submit").click(function(e){
        //alert(codehelper_ip.IP);
        //alert(codehelper_ip.CityName);
        e.preventDefault();
        var Input = $("#Message").val();
        //alert(Input);
        $(".Talk ul").append('<li>'+'['+ codehelper_ip.CityName +'~'+codehelper_ip.IP+']'+Input+'</li>');
        $("#Message").val("");
    });
setInterval(main,500);
});
function main(){
    var count = $(".Talk li").length;
    if(count >= 20 ){
        //alert("20th");
         $(".Talk li").remove();
    }
}

这与您正在使用的技术无关。您需要Meteor服务器、node.js socket.io服务器或其他将消息从您传输给其他用户的服务器（反之亦然）。目前，你只是将用户键入的消息添加到他浏览器中的页面副本中。聊天应用程序实际上相当困难，您肯定需要更深入地了解Web的工作方式；在大多数网络托管提供商上，你根本无法做到这一点，因为他们只支持Apache（尽管它很棒，但无法为聊天应用程序做需要做的事情）。

相关文章：