jquery ajax聊天室

image.png

html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css"> body{ margin:0; padding:0; font-size:12px; } #messagewindow { height: 250px; border: 1px solid; padding: 5px; overflow: auto; } #wrapper { margin: auto; width: 438px; } </style> <script src="../scripts/jquery.js" type="text/javascript"></script> <script type="text/javascript"> //<![CDATA[

("#chatform").submit(function(){

("#msg").val(), name:

("#msg").val(""); //调用解析xml的函数 addMessages(xml); }); return false; //阻止表单提交 }); }); //更新信息函数,每隔一定时间去服务端读取数据 function updateMsg(){

("#loading").remove(); //调用解析xml的函数 addMessages(xml); }); //每隔4秒,读取一次. setTimeout('updateMsg()', 4000); } //解析xml文档函数,把数据显示到页面上 function addMessages(xml) { //如果状态为2,则终止 if(

("time",xml).text(); //

("message",xml).each(function() { var author =

("text",this).text(); //内容 var htmlcode = "<strong>"+author+"</strong>: "+content+"<br />"; $("#messagewindow").prepend( htmlcode ); //添加到文档中 }); } //]]> </script>

</head> <body>

<div id="wrapper">
    <p id="messagewindow"><span id="loading">加载中...</span></p>
    <form id="chatform" action="#">
        姓名: <input type="text" id="author" size="50"/><br />
        内容: <input type="text" id="msg"  size="50"/>   <br /> 
        <input type="submit" value="发送" /><br />
    </form>
</div>

</body> </html>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏老码农的一亩三分地

IT兄弟连 HTML5教程 HTML5的靠山 RFC、WHATWG是什么WEB的新标准

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。

9430
来自专栏C语言入门到精通

基础知识 | 每日一练(120)

小林:老版的 toupper() 和 tolower() 不一定能够正常处理不需要转换的字符参数,例如数字、标点或已经符合请求的字符。在 ANSI/ISO 标准...

9130
来自专栏测试邦

后selenium时代Web UI自动化测试框cypress

优点:selenium 的 API 封装遵循 W3C 提供的 webdriver 标准,很好的支持主流浏览器chrome,firefox,IE,Safari等,...

14320
来自专栏Core Net

ASP.NET Core 2.2 : 二十一. 内容协商与自定义IActionResult和格式化类

上一章的结尾留下了一个问题:同样是ObjectResult,在执行的时候又是如何被转换成string和JSON两种格式的呢?

8120
来自专栏老码农的一亩三分地

IT兄弟连 JavaWeb教程 JSTL常用标签

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。

8010
来自专栏智能计算时代

「首席架构师推荐」React生态系统大集合

16820
来自专栏前端劝退师

90行代码,15个元素实现无限滚动

无限下拉加载技术使用户在大量成块的内容面前一直滚动查看。这种方法是在你向下滚动的时候不断加载新内容。

17920
来自专栏好好学java的技术栈

几个IDEA的NB插件,还带动态图的。

一款热部署插件,只要不是修改了项目的配置文件,用它都可以实现热部署。收费的,破解比较麻烦。不过功能确实很强大。算是开发必备神器了。热部署快捷键是control+...

7030
来自专栏Java架构沉思录

预防XSS,这几招管用!

大家应该都听过 XSS (Cross-site scripting) 攻击问题,或多或少会有一些了解,但貌似很少有人将这个问题放在心上。一部分人是存有侥幸心理:...

13240
来自专栏老码农的一亩三分地

IT兄弟连 JavaWeb教程 文件上传技术

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。

7120

扫码关注云+社区

领取腾讯云代金券

年度创作总结 领取年终奖励