《网站建设》期末考试,国际热点新闻最新消息,公司网站优化要怎么做,小程序制作怎么导入题库传统#xff1a;上半部分评论列表直接通过数据库查询语句读取并显示#xff0c;每当提交新的评论时#xff0c;先传递给处理页面#xff0c;处理页面处理完毕后再返回index.asp这个页面#xff0c;当然index.asp是重新加载获得新的评论。 Ajax:#xff1a;首先列表页面… 传统上半部分评论列表直接通过数据库查询语句读取并显示每当提交新的评论时先传递给处理页面处理页面处理完毕后再返回index.asp这个页面当然index.asp是重新加载获得新的评论。 Ajax:首先列表页面的内容是一个单独的xml文件(pl_list.asp)然后index..asp中的上半部分评论通过XmlHttpRequest请求pl_list.asp页面并通过返回的结果传递到需要更新区域。提交评论同样如此每次提交采用XmlHttpRequest请求提交处理程序然后重新更新评论列表显示区域。 此新闻评论系统共分为五个部分分别为数据库、前台页面、JS代码、服务器处理、CSS样式。 数据库的设计 PL表 字段名 类型 长度 id 自动编号 user 文本 20 dateandtime 日期/时间 content 备注 newid 数字 前台页面(index.htm) 前台页面共包括两部分上半部分为页面评论列表显示下半部分为提交评论。由于我们这里只是模拟一个新闻评论系统并没有真正的新闻页面那么在传递新闻ID的时候我们采用了一个默认值input namenewsid value1 typehidden/。 代码index.htm %LANGUAGEVBSCRIPT CODEPAGE936%!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtdhtml xmlnshttp://www.w3.org/1999/xhtmlheadmeta http-equivContent-Type contenttext/html; charsetgb2312 /title评论系统/titlescript srcmain.js/scriptlink hrefmain.css relstylesheet typetext/css //headbodydiv idpllist正在加载评论……script loadDom();setTimeout(loadDom(),10000);/script/divdiv stylewidth:240px;font-size:12px;text-align:centerfieldsetlegend评论/legend呢称input nameuser typetext stylewidth:180px/input namenewsid value1 typehidden/br/内容textarea namecontent stylewidth:180px;height:80px/textareabr/input namesubmit value我要评论 οnclickfb(); typebutton //fieldset/divdiv stylefont-size:12px; idmsg/div/body/html JS代码页(核心部分) main.js JS代码算是本系统的一个核心部分了Ajax的体现基本全包含在这短短数十行的代码中是连结前台与后台处理的一个桥梁可谓是重中之重为了更好的让大家理解整个功能我们将分段介绍。 1、获得XmlHttp对象创建并返回一个XmlHttp对象。 var xhr;function getXHR() {try {xhrnew ActiveXObject(Msxml2.XMLHTTP);} catch (e) {try {xhrnew ActiveXObject(Microsoft.XMLHTTP);} catch (e) {xhrfalse;}}if(!xhrtypeof XMLHttpRequest!undefined) {xhrnew XMLHttpRequest();}return xhr;}function openXHR(method,url,callback) {getXHR();xhr.open(method,url);xhr.onreadystatechangefunction() {if(xhr.readyState!4)return;callback(xhr);}xhr.send(null);}function loadXML(method,url,callback) {getXHR();xhr.open(method,url);xhr.setRequestHeader(Content-Type,text/xml);xhr.setRequestHeader(Content-Type,GBK);xhr.onreadystatechangefunction() {if(xhr.readyState!4) return;callback(xhr);}xhr.send(null);} 具体的调用方法loadXML(method,url,callback)method: http方法例如POST、GET、PUT及PROPFINDurl: 请求的URL地址可以为绝对地址也可以为相对地址callback:自定义的返回处理函数 转载于:https://www.cnblogs.com/bihailantian/archive/2010/10/03/1841608.html
