(window.slotbydup=window.slotbydup || []).push({
id: '2491531',
container: s,
size: '150,90',
display: 'inlay-fix'
怎样使用AJAX技术实现无闪自动局部刷新？
全部答案（共1个回答）
及时刷新数据的问题，如果使用 的方法，会造成整个屏幕不断闪烁刷新的效果，这会降低用户的操作满意度。 　　所以我们需要一种可以实现无闪自动刷新数据的方法来解决以上问题。 　　实例解决问题： 　　希望实现用户在进入系统以后（整个session的时效之内）,如果收到新邮件则发出声音提示。 　　实现思路： 　　1.首页部分：');"
load时调用in...
我们在网页制作的过程中经常会遇到及时刷新数据的问题，如果使用 的方法，会造成整个屏幕不断闪烁刷新的效果，这会降低用户的操作满意度。 　　所以我们需要一种可以实现无闪自动刷新数据的方法来解决以上问题。 　　实例解决问题： 　　希望实现用户在进入系统以后（整个session的时效之内）,如果收到新邮件则发出声音提示。 　　实现思路： 　　1.首页部分：');"
load时调用init(use); 　　2.js部分：用XMLHTTP实现页面局部刷新，调用check_mail.jsp对后台数据库进行检索判断并返回结果。 "; checkesult=0; } } } --　　3.check_mail.jsp 　　4.首页结果显示 　　将 插入指定位置。
以上是我对于这个问题的解答，希望能够帮到大家。
先做一个JSP页面，就和你正常情况下根据ID查数据一样，得到ID，根据ID查询出数据。
循环出表格在页面上。
只是这个页面不会通过浏览器直接访问。
而是用aja...
阅读提要 AJAX，一个异步JavaScript和XML的缩略词，是当今快速发展的Web开发界十分热门的技术。在这项新技术提供巨大能力的同时，它也燃发了在"Ba...
不同意楼上的,即便是因为BORDER的设置问题, 不会是白色的边边，问题是出在PS里面,是图片处理问题.
一、系统实现的功能 本会议室系统主要用于EasyJF开源团队的成员网上会议使用，会议系统模拟传统的会议形式，可以同时开设多个不同主题的会议室，每个会议室需要提供...
右键点技能,如果设为自动的话技能周围会有个框,跟WAR3一样,不过框没有流动效果.另外,一直放技能很费饱食度的.
答: 这个好像不能恢复吧
答: 2010版的..
答: 保护系统安全，是指从整体电子商务系统或网络支付系统的角度进行安全防护，它与网络系统硬件平台、操作系统、各种应用软件等互相关联
要有经营场所，办理工商登记（办理卫生许可），如果觉得有必要还要到税务局买定额发票，不过奶茶店一般人家消费是不会要发票的巴，要买设备，要联系供应商备一些原料，就好啦，没啥难的，不过要赚钱的话就得选好开店地段。
办理手续的程序（申领个体执照）：
1、前往工商所申请办理
2、根据工商所通知（申请办理当场就会给你个小纸条）前往办理名称预核
3、拿到名称预核通知书，办理卫生许可证（前往所在地卫生监督所办理）
4、拿着名称预核通知书和卫生许可证前往工商所核发营业执照。
这个问题有点不知所问了。
公务员并不由单位性质决定，行政单位行政编的是公务员，但并不是说行政单位的就是公务员，事业单位里面参照管理的也是公务员。
所以你的问题只能回答为：按公务员管理的是公务员。
如果是下拉的，只有党员而没有预备党员一项，可填党员，但如果是填写的，你就老老实实填预备党员，填成党员对你没什么好处，填预备党员也不会有什么吃亏。
对于由非金属通过共价键形成的化合物,极性与否不是看键是不是极性的.而是要分析几个键之间的相互作用力是否可以抵消,像CO2是直线型的,结构式为:O=C=O,作用力等效作用于碳原子两边,按物理上的受力分析来看,不正好得以抵消吗?而SO2由于受力方向不同,就无法达到这样的效果.
平时做的练习里也常常会出现让你写一下分子构型或是电子式的,出现频率较高的有:NH3(三角锥型),CH4(正四面体),CO2(直线型),像过氧化物的有时也会让你写一下电子式.这些一般讲知识点的时候老师都会提及到的.
1用作燃料，由于固体成分多，一般将其与重油混合或者制作成浆料使用，能够起到部分代替重油的作用。
2用于碳素电极的生产，煤沥青中的碳石墨化程度相对较高，可以作为电极材料生产，也可以作为浸润剂和粘结剂使用，这方面产品种类多、涉及产品广，是煤沥青的主要用途。
3涂料，主要经处理加工后，用于建筑物及管材防水涂料。环氧煤沥青涂料是其中应用最广的一种。
4筑路及建筑材料，一般与石油沥青混合使用，煤沥青和石油沥青相比，有明显的质量差距和耐久性差距。煤沥青塑性差，温度稳定性差，冬季脆，夏季软化，老化快，而两者的混合沥青性能优于各自单独使用。此外，煤沥青有害物较多，其中不少对人体危害很大，经无害化处理之后再使用才会比较环保。
5针状焦、活性炭、碳纤维等高附加值产品。煤沥青残炭值高，石墨化成分多，加工容易，而针状焦、碳纤维都是高端材料，附加值较高，以煤沥青为原料相当于变废为宝。
1、电子(IT)类：压克力手机架、压克力优盘架、MP3/MP4展架、有机玻璃VCD展架、数码相机展架、笔记本电脑展架、摄像头展架、ACRYLIC摇控器摆件架。电池箱、形像展示柜、专卖柜等。
2、装修类：有机玻璃装饰品、物业标牌、广告牌、形象牌、纸巾盒等。
3、烟草名酒类：烟架、塑料烟盒、酒架、酒盒、亚克力酒水牌、三角台卡、烟酒专卖柜等。
4、用品展示类：资料架、笔架、鞋架、眼镜架、手表展架、名片座、文具座、压克力台历座等。
5、女式用品类：化妆护肤品展架、珠宝盒、珠宝道具、饰品展架、形像专卖展柜。
6、精品类：相座、鱼缸、像架，药盒、纸镇、精品展盒、经销牌。
7、水晶工艺品类：水晶奖杯、水晶模型、水晶内雕、水晶装饰品。
8、水晶胶制品类：水晶胶工艺品、真品内藏制品。
9、有机旋转展示架：也是展架的一种，用于手表，手饰，精品，手机，MP3，通信设施的展示，展示架中心有一条灯管，上下均可装有灯，可全方位展示出产品的特征。风格优美，高贵典雅、又有良好的装饰效果，有机旋转展示架使产品发挥出不同凡响的魅力。
1、热熔工具接通电源，到达工作温度指示灯亮后方能开始操作;
2、切割管材，必须使端面垂直于管轴线。管材切割一般使用管子剪或管道切割机，必要时可使用锋利的钢锯，但切割后管材断面应去除毛边和毛刺;
3、管材与管件连接端面必须清洁、干燥、无油;
4、用卡尺和合适的笔在管端测量并标绘出热熔深度。
5、熔接弯头或三通时，按设计图纸要求，应注意方向，在管件和管材的直线方向上，用辅助标志标出其位置;
6、连接时，无旋转的把管端导入热套内，插入到所标志的深度，同时，无旋转的把管件推到加热头上，达到规定标志处。加热时间应满足上表的规定(也可按热熔工具生产厂家的规定);
7、达到加热时间后，立即把管材与管件从加热套与加热头上同时取下，迅速无旋转的直线均匀插入到所标深度，是接头处形成均匀凸缘;
8、在规定的加工时间内，刚熔接好的接头还可校正，但严禁旋转。
1、不能够面向厕所;不能够面向房门内;不能够面向餐桌。
2、财神爷不能够与祖先放置在水平位置，有些人将祖先排位和财神爷放在一起供奉，其实都是不可取的。需要将祖先排位放在财神爷的下面，这才是可取的。
一、整体系统原则
整体系统论，作为一门完整的科学，它是在本世纪产生的;作为一种朴素的方法，中国的先哲很早就开始运用了。风水理论思想把环境作为一个整体系统，这个系统以人为中心，包括天地万物。环境中的每一个子系统都是相互联系、相互制约、相互依存、相互对立、相互转化的要素。风水学的功能就是要宏观地把握协调各系统之间的关系优化结构，寻求最佳
二、因地制家原则
因地制宜，即根据环境的客观性，采取适宜于自然的生活方式。中国地域辽阔，气候差异很大，土质也不一样，建筑形式亦不同。西北干旱少雨，人们就采取穴居式窑洞居住。窑洞位多朝南，施工简易，不占土地，节省材料，防火防寒，冬暖夏凉，人可长寿，鸡多下蛋。西南潮湿多雨，虫兽很多，人们就采取干阑式竹楼居住。
三、依山傍水原则
依山傍水是风水学最基本的原则之一。山体是大地的骨架，水域是万物生机之源泉，没有水，人就不能生存。考古发现的原始部落几乎都在河边台地，这与当时的狩猎和捕捞、采摘经济相适应。
四、观形察势原则
中国的地理形势，每隔8度左右就有一条大的纬向构造，如天山棗阴山纬向构造;昆仑山棗秦岭纬向构造。《考工记》云“天下之势，两山之间必有川矣。大川之上必有途矣。”《禹贡》把中国山脉划为四列九山。风水学把绵延的山脉称为龙脉。龙脉源于西北的昆仑山，向东南延伸出三条龙脉，北龙从阴山、贺兰山入山西，起太原，渡海而止。中龙由岷山入关中，至泰山人海。南龙由云贵、湖南至福建、浙江入海。每条大龙脉都有干龙、支龙、真龙、假龙、飞龙、潜龙、闪龙，勘测风水首先要搞清楚来龙去脉，顺应龙脉的走向。
五、地质检验原则
风水思想对地质很讲究，甚至是挑剔，认为地质决定人的体质，现代科学证明这不是危言耸听。
六、水质分析原则
风水学理论主张考察水的来龙去脉，辩析水质，掌握水的流量，优化水环境，这条原则值得深入研究和推广。
七、坐北朝南原则
坐北朝南，不仅是为了采光，还为了避风。中国的地势决定了其气候为季风型。冬天有西伯利亚的寒流，夏天有太平洋的凉风，一年四季?风向变换不定。甲骨卜辞有测风的记载。
八、适中居中原则
适中，就是恰到好处，不偏不倚，不大不小，不高不低，尽可能优化，接近至善至美。
九、顺乘生气原则
风水理论认为，气是万物的本源。太极即气，一气积而生两仪，一生三而五行具，土得之气，水得之于气，人得之于气，气感而应，万物莫不得于气。
十、改造风水原则
人们认识世界的目的在于改造世界为自己服务。中国的乡村建设很注重改造风水。如果我们下功夫，花气力翻捡一遍历史上留下来的坟志书和村谱、族谱，每部书的首卷都叙述了地理风水，细加归纳，一定会发现许多改造风水的记载。就目前来讲，如深圳、珠海、广州、汕头、上海、北京等许多开放城市，都进行了许多的移山填海，建桥铺路，折旧建新的风水改造工作，而且取得了很好的效果。
维护保养：(1)冬虫夏草超微粉碎机当机器累计工作到50小时左右，要拆开机器各部件，进行检查和清洗;累计工作到200小时，应该对轴承座里面的轴承、油杯和毡封进行清洗，并重新涂抹润滑剂。冬虫夏草超微粉碎机工作过程中，要经常注意机器的声音及震动情况，在震动很强烈时，应该及时查找原因，进行调整。机器长时间不使用时，应该将三角带卸下，并在冬虫夏草超微粉碎机表面，转子，赤坂和齿轮上涂抹润滑油以防生锈，将机器至于干燥、通风的地方保存好。
(2)当冬虫夏草超微粉碎机工作一段时间后，产量开始下降，应该对如下方面进行检查和维修：
①锤片过度磨损。当锤片使用一段时间之后，夹角会被磨圆，前端会被磨损，影响机器正常运作，降低产量，此时，应该调换锤片的角度，为了转子的平衡，应该把四个锤片同时更换，并且按照原来的方法排列安装。对称轴的两组锤片不应该超过5g，否则会引起冬虫夏草超微粉碎机机身的强烈震动。
②筛片磨损。筛片磨损后要及时更管，安装新的筛片时，毛口应该面向里面，筛架与筛片要贴合紧密，安装环筛的时候，里层的荐口应当顺着旋转方向，这样防止饲料在接口处卡主或者物料的泄露。
深圳鑫仁电子贸易有限公司，是一家诚信 价高，服务好，口碑好的一家再生资源回收公司。经过千山万水，终于找到这家可靠，可信 ，又专业的公司，为各大企业提供了，真正的解决了消防 环保 废旧金属 垃圾污染问题
技术参数量程范围：-100Kpa～200MPa;供电电压：12~35V DC(24V DC 校准电压)/交流220vAC供电输出继电器容量：380V 3A, 220V 5A，24V DC 5A等精 度：优于0.0.5%FS、1%FS等各种设置范围：全量程段可以设置采样速率：10次/秒(可以根据客户需要定制要求的速度)。接口螺纹：M20*1.5、G1/4、G1/2、1/4NPT(可以根据客户需要定制)
电子废弃物的成分复杂，其中半数以上的材料对人体有害，有一些甚至是剧毒的。比如，一台电脑有700多个元件，其中有一半元件含有汞、砷、铬等各种有毒化学物质;电视机、电冰箱、手机等电子产品也都含有铅、铬、汞等重金属;激光打印机和复印机中含有碳粉等。
新加坡在放宽中国旅游签证的同时，也决定放宽和简化中国商家到新加坡的商务签证条例，向在新加坡当地有业务的中国商家发出两年或更长时间的多次出入境签证。 华商盛世是中国最具价值的海外游学供应商，是海外教育培训产业链中关键资源的有效组织者。
正在加载...
Copyright &
Corporation, All Rights Reserved
确定举报此问题
举报原因(必选)：
广告或垃圾信息
激进时政或意识形态话题
不雅词句或人身攻击
侵犯他人隐私
其它违法和不良信息
报告，这不是个问题
报告原因(必选)：
这不是个问题
这个问题分类似乎错了
这个不是我熟悉的地区纯JS实现AJAX局部刷新功能
转载 & & 投稿：mrr
下面给大家介绍JS实现AJAX局部刷新功能，通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。对ajax实现局部刷新功能感兴趣的朋友一起看看吧
AJAX即“Asynchronous Javascript And XML”（异步JavaScript和XML），是指一种创建交互式网页应用的网页开发技术。
AJAX = 异步 JavaScript和XML（标准通用标记语言的子集）。
AJAX 是一种用于创建快速动态网页的技术。
下面给大家介绍JS实现AJAX局部刷新功能，具体内容如下所示：
通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。
// 创建XMLHttpRequest对象
var xhr=new XMLHttpRequest();
xhr.open('post','03-ajaxPost.php');
xhr.setRequestHeader('Content-Type',' application/x-www-form-urlencoded');
//请求主体 post send 设置数据
xhr.send('name='+txt);
//监听服务器的响应
xhr.onreadystatechange=function(){
if(xhr.readyState==4&&xhr.status==200){ //这里表示接受服务器的响应成功的时候
var r=xhr.responseT
document.querySelector('.info').innerHTML=r;
以上所述是小编给大家介绍的纯JS实现AJAX局部刷新功能，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
您可能感兴趣的文章:
大家感兴趣的内容
12345678910
最近更新的内容
常用在线小工具在 SegmentFault，学习技能、解决问题
每个月，我们帮助 1000 万的开发者解决各种各样的技术问题。并助力他们在技术能力、职业生涯、影响力上获得提升。
问题对人有帮助，内容完整，我也想知道答案
问题没有实际价值，缺少关键内容，没有改进余地
如图 我点击menu区域的菜单，content局部刷新成对应的内容。如果用模板引擎可以分成不同的模板，但是没用。现在想用ajax刷新。那么我现在不清楚的问题是。content区域的html代码都是用后台封装好我用ajax请求过来的吗？
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
样式是固定的 只是数据会刷新而已这些样式都是提前写好的
点击左边之后
改变对应的右侧内容
然后ajax刷新数据
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
关于content区域的html代码都是用后台封装好我用ajax请求过来的这个不一定，后端提供需要的数据，前端js组装数据渲染就可以了，前端也可以用模板引擎啥的，比如laytpl等
分享到微博？
关闭理由：
删除理由：
忽略理由：
推广（招聘、广告、SEO 等）方面的内容
与已有问题重复（请编辑该提问指向已有相同问题）
答非所问，不符合答题要求
宜作评论而非答案
带有人身攻击、辱骂、仇恨等违反条款的内容
无法获得确切结果的问题
非开发直接相关的问题
非技术提问的讨论型问题
其他原因（请补充说明）
我要该，理由是：
在 SegmentFault，学习技能、解决问题
每个月，我们帮助 1000 万的开发者解决各种各样的技术问题。并助力他们在技术能力、职业生涯、影响力上获得提升。博客分类：
&div class="iteye-blog-content-contain" style="font-size: 14px"&&/div&
先说点无关紧要的吧，两个知识点：
(1)，方法一：使用Js局部刷新验证码的做法是在页面中加上一个img标签，src属性设为一个servlet或者.jsp来请求验证码图片，html代码如下:
&img src="ImageServlet" onclick="refresh(this)"/&
在一般情况下刷新一次页面，验证码图片也会变化一次，但有时候我们希望验证码图片变化时不刷新整个页面，也就是局部刷新的效果，代码如下：
script type="text/javascript"&
function refresh(obj){
obj.src="ImageServlet?id="+Math.random();
其中需要注意的是请求路径中必须要有参数（参数名可随意定义），参数值不能是一个固定值而是随机数。代码中obj对象是指img标签对象。
html代码如下：
&img src="ImageServlet"
id="picture" &&span style='color:#0000cc'
onclick="refresh()"&看不清,换一张&/span&
js代码如下：
function refresh(){
document.getElementById("picture").src="ImageServlet?id="+Math.random();
（2)，获取图片的ImageServlet代码如下：
import java.awt.C
import java.awt.F
import java.awt.Graphics2D;
import java.awt.image.BufferedI
import java.io.IOE
import java.util.R
import javax.servlet.ServletE
import javax.servlet.ServletOutputS
import javax.servlet.http.HttpS
import javax.servlet.http.HttpServletR
import javax.servlet.http.HttpServletR
import com.sun.image.codec.jpeg.JPEGC
import com.sun.image.codec.jpeg.JPEGImageE
* Servlet implementation class ImageServlet
public class ImageServlet extends HttpServlet {
// 定义可选择的字符
private static final String CHARS = "abcdefghjkmnopqrstuvwxyzABCDEFGHJKLMNOPQRSTUVWXYZ";
static Random random = new Random();
// 得到一个随机的字符串
private String getRandomString() {
StringBuffer buffer = new StringBuffer();
for (int i = 0; i & 4; i++) { // 生成四个字符
buffer.append(CHARS.charAt(random.nextInt(CHARS.length())));}
return buffer.toString();
// 随机背景颜色
public static Color getRandomColor() { // 得到随机颜色
return new Color(random.nextInt(128) + 127, random.nextInt(128) + 127,random.nextInt(128) + 127);
public static Color getReverseColor(Color c) { // 得到颜色的反色
return new Color(255 - c.getRed(), 255 - c.getGreen(),
255 - c.getBlue());
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("image/jpeg"); // 设置输出类型
// 得到随机字符串
String randomString = getRandomString();
// 将getSession（）设置为true，当会话不存在是返回null
request.getSession(true).setAttribute("randomString", randomString);
// 设置图片的宽、高
int width = 80;
int height = 30;
Color bcolor = getRandomColor(); // 设置背景色
Color fcolor = getReverseColor(bcolor); // 前景色
// 创建一个彩色图片
BufferedImage bimage = new BufferedImage(width, height,
BufferedImage.TYPE_INT_BGR);
// 创建绘图对象,从bimage上得到的绘制对象，会把数据绘制到bimage上
Graphics2D g = bimage.createGraphics();
// 字体样式为宋体,加粗，20磅
g.setFont(new Font("Vijaya", Font.BOLD, 20));
// 先画出背景色
g.setColor(bcolor);
g.fillRect(0, 0, width, height);
// 再画出前景色
g.setColor(fcolor);
for (int i = 0; i & randomString.length(); i++) {
// 绘制随机字符
g.drawString(randomString.charAt(i) + "", 10 + i * 12, 22);
// 画出干扰点
for (int i = 0, n = random.nextInt(100); i & i++) {
g.fillRect(random.nextInt(width), random.nextInt(height), 1, 1);
// 将图像输出到浏览器
ServletOutputStream outstream = response.getOutputStream();
JPEGImageEncoder encoder = JPEGCodec.createJPEGEncoder(outstream);
encoder.encode(bimage);
outstream.flush();
outstream.close();
现在说到核心的Ajax技术：
传统web页面的服务是基于http协议的，所以它永远也改变不了“请求—响应”的模式。你必须“点”一下，它才能动一下，而且每次都必须刷新整个页面，这也意味着服务器要将所有页面上的数据传送下来，即使你的点击只是需要改变页面上一行十个字的内容； AJAX代码运行在浏览器和服务器之间，通过编程，你可以让ajax代码仅从服务器上提取需要改变的数据，也只改变页面中需要改变的某一部分：某一个div层、表格中的某一个单元格。用户不会看到页面全部被刷新了；当使用了ajax技术时，用户发送请求时(点击事件)将交由ajax代码处理，用户请求即完成。AJAX代码随后自己将请求发送给服务器，一旦服务器返回的响应，AJAX代码即根据返回的业务更新页面上的某个部分，这部分是由AJAX处理完成，与用户操作流程无关。
我们以一个典型的示例：即时验证是否有重复用户名的AJAX应用为例，讲解AJAX编写的基本步骤
1，当用户输入用户名后，焦点离开输入框，即触发输入框的onBlur事件，这个事件将调用js编写的ajax代码，将用户输入发送给服务器验证，并将服务器返回的结果消息显示在输入框下面的div层上。
这个流程将由三部分组成：
login.html:用户填写用户名的页面：
CheckUserNameServlet.java:服务器上用来验证用户名的Servlet，返回一个字符串作为结果；
Js编写的AJAX代码:请送请求，并更新页面
AJAX第一步：创建XMLHTTPRequest对象；
XMLHTTPRequest是AJAX应用中的核心API，它被js调用以向服务器发送请求，并异步接收服务器返回的数据后，更新局部页面。使用AJAX功能时，首先要在js中创建XMLHTTPRequest对象：
&script type="text/javascript"&
//定义了XMLHttpRequest对象
//创建XMLHttpRequest对象函数
function getRequestObject() {
if (window.ActiveXObject) {
request=new ActiveXObject("Microsoft.XMLHTTP");
} else if (window.XMLHttpRequest) {
request=new XMLHttpRequest();
window.alert("你的浏览器不支持XMLHTTPRequest，将无使用AJAX功能！");
在这段脚本中，getRequestObject函数调用后，将创建一个XMLHTTPRequest对象。注意其中的if判断，因为这世界还不是平的，IE和FireFox是有差别的；第一个if判断如果是IE浏览器，则调用MS的请求对象，第二个在浏览器是FireFox、Netscape的情况下会有效；当然，最后实在不行了，就告诉用户这玩不成啦。
AJAX第二步：编写回调方法;
现在我们有了请求对象，接下来要考虑的是XMLHTTPRequest对象向服务器发送请求后，服务器返回的结果应该如何处理，即AJax中的回调方法；在实现这个处理逻辑前先看一下页面的html代码：
&html&&head&
&meta http-equiv="Content-Type" content="text/ charset=GBK"&
&title&AJAX检测重复用户名 蓝杰信息@NetJava.cn&/title&
&br&注册用户名:&input type="text" name="userName"/&
&!-- 这个div层内将显示ajax从服务器返回的消息 --&
&div id=divErrorName" style="color:"&&/div&
密码:&input type="password" name="userPWD"/&
&br&&input type="button" name="regUser" value="注册"/&
回调方法要实现的逻辑很简单，就是将CheckUserNameServlet.java这个Servlet返回的消息显示到名字为divErrorName的div中。如下代码：
//回调方法实现:将服务器返回的消息更新到div中
function processResult() {
if ((request.readyState == 4) &&
(request.status == 200)) {
//1.弹出对话框以便调试
alert("服务器返回的是: "+request.responseText);
//显示到指定的组件中
document.getElementById("divErrorName").innerHTML=request.responseT
上面这段代码，关键在if判断语句，请求对象的readyState属性值代表请求对象的当前状态，为4时，代表己处理完成；而status为http应答代码，200表示服务器响应OK，如果是404呢？
如果请求对象己处理完毕，服务器返回的应答码也是OK的了，就请求对象的responseText属性值就代表了服务器返回给客户端的文本内容。
AJAX第三步：发送异步请求
必须清楚的知道，AJAX发送的请求也是通过HTTP协议传送着，这意味着ajax也可以发送get或post请求，请看如下代码：
function sendRequest() {
//创建XMLHTTPRequest对象
getRequestObject();
//绑定回调方法，
request.onreadystatechange=processR
//发送请求
// request.open("GET", "index.jsp", true);
//发送Post请求
request.open("POST", "servlet/CheckUserNameServlet", true);
request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
var userName=document.getElementById("userName").
//将userName做为请求参数发送上去
request.send("userName="+userName);
CheckUserNameServlet代码如下：
public class CheckUserNameServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doPost(HttpServletRequest request,HttpServletResponse response) throws ServletException, IOException {
String userName = request.getParameter("userName");
System.out.println("收到了请求"+username);
PrintWriter out = response.getWriter();
if(userName.equals("newer")){
out.write("用户名已经被占用");
out.write("该用户名可以被使用");
out.flush();
完整的html页面完整代码如下：
&html&&head&
&meta http-equiv="Content-Type" content="text/ charset=GBK"&
&title&AJAX检测重复用户名 蓝杰信息@NetJava.cn&/title&
&script type="text/javascript"&
//定义了XMLHttpRequest对象
//创建XMLHttpRequest对象函数
function getRequestObject() {
if (window.ActiveXObject) {
request=new ActiveXObject("Microsoft.XMLHTTP");
} else if (window.XMLHttpRequest) {
request=new XMLHttpRequest();
window.alert("你的浏览器不支持XMLHTTPRequest，将无使用AJAX功能！");
//回调方法实现:将服务器返回的消息更新到div中
function processResult() {
if ((request.readyState == 4) &&
(request.status == 200)) {
//1.弹出对话框以便调试
alert("服务器返回的是: "+request.responseText);
//显示到指定的组件中
document.getElementById("divErrorName").innerHTML=request.responseT
//发送请求,绑定回调方法
function sendRequest() {
//创建XMLHTTPRequest对象
getRequestObject();
//绑定回调方法，
request.onreadystatechange=processR
//发送请求
// request.open("GET", "index.jsp", true);
//发送Post请求
request.open("POST", "servlet/CheckUserNameServlet", true);
request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
var userName=document.getElementById("userName").
//将userName做为请求参数发送上去
request.send("userName="+userName);
&br&注册用户名:&input type="text" name="userName" onBlur="sendRequest();"/&
&!-- 这个div层内将显示ajax从服务器返回的消息 --&
&div id="divErrorName" style="color:"&&/div&
密码:&input type="password" name="userPWD"/&
&br&&input type="button" name="regUser" value="注册"/&
4，通过上面的Ajax三部曲，现在回到验证码刷新和验证
1，页面实现：
&%@ page language="java" contentType="text/ charset=UTF-8"
pageEncoding="UTF-8"%&
&!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&script type="text/javascript"&
function refresh(){
document.getElementById("picture").src="ImageServlet?id="+Math.random();
//异步请求对象
function createXMLHttpRequest() {
if (window.ActiveXObject) {
request = new ActiveXObject("Microsoft.XMLHTTP");
} else if (window.XMLHttpRequest) {
request = new XMLHttpRequest();
window.alert("你的浏览器不支持XMLHTTPRequest，将无使用AJAX功能！");
//回调函数[响应之后执行的函数]
function processResult() {
if ((request.readyState == 4) && (request.status == 200)) {
var str = request.responseT
if(str=="true"){
//显示到指定的组件中
alert("恭喜你！！！验证码正确");
//显示到指定的组件中
alert("验证码错误!!!!");
//发送请求,绑定回调方法
function sendRequest() {
//创建XMLHTTPRequest对象
createXMLHttpRequest();
//绑定回调方法，
request.onreadystatechange = processR
//获得输入框中的内容
var validate = document.getElementById("Validate").
//发送请求
// request.open("GET", "AccountCheckServlet?username="+username, true);
//发送Post请求
request.open("POST", "validateServlet", true);
request.setRequestHeader("Content-Type",
"application/x-www-form-urlencoded");
//将userName做为请求参数发送上去
request.send("validate=" + validate);
//request.send(null);
用户名：&input type="text" name="userName"&&br/&
验证码：&input type="text" name="Validate" value="Validate" onblur="sendRequest()"&& img src="ImageServlet" id="picture"&&span style='color:#0000cc'
onclick="refresh()"&看不清,换一张&/span&
2，ImageServlet获取图片，代码见本文档开始处；
import java.awt.C
import java.awt.F
import java.awt.Graphics2D;
import java.awt.image.BufferedI
import java.io.IOE
import java.util.R
import javax.servlet.ServletE
import javax.servlet.ServletOutputS
import javax.servlet.http.HttpS
import javax.servlet.http.HttpServletR
import javax.servlet.http.HttpServletR
import com.sun.image.codec.jpeg.JPEGC
import com.sun.image.codec.jpeg.JPEGImageE
* Servlet implementation class ImageServlet
public class ImageServlet extends HttpServlet {
// 定义可选择的字符
private static final String CHARS = "abcdefghjkmnopqrstuvwxyzABCDEFGHJKLMNOPQRSTUVWXYZ";
static Random random = new Random();
// 得到一个随机的字符串
private String getRandomString() {
StringBuffer buffer = new StringBuffer();
for (int i = 0; i & 4; i++) { // 生成六个字符
buffer.append(CHARS.charAt(random.nextInt(CHARS.length())));
return buffer.toString();
// 随机背景颜色
public static Color getRandomColor() { // 得到随机颜色
return new Color(random.nextInt(128) + 127, random.nextInt(128) + 127,
random.nextInt(128) + 127);
public static Color getReverseColor(Color c) { // 得到颜色的反色
return new Color(255 - c.getRed(), 255 - c.getGreen(),
255 - c.getBlue());
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("image/jpeg"); // 设置输出类型
// 得到随机字符串
String randomString = getRandomString();
// 将getSession（）设置为true，当会话不存在是返回null
request.getSession(true).setAttribute("randomString", randomString);
// 设置图片的宽、高
int width = 80;
int height = 30;
Color bcolor = getRandomColor(); // 设置背景色
Color fcolor = getReverseColor(bcolor); // 前景色
// 创建一个彩色图片
BufferedImage bimage = new BufferedImage(width, height,
BufferedImage.TYPE_INT_BGR);
// 创建绘图对象,从bimage上得到的绘制对象，会把数据绘制到bimage上
Graphics2D g = bimage.createGraphics();
// 字体样式为宋体,加粗，20磅
g.setFont(new Font("Vijaya", Font.BOLD, 20));
// 先画出背景色
g.setColor(bcolor);
g.fillRect(0, 0, width, height);
// 再画出前景色
g.setColor(fcolor);
for (int i = 0; i & randomString.length(); i++) {
// 绘制随机字符
g.drawString(randomString.charAt(i) + "", 10 + i * 12, 22);
// 画出干扰点
for (int i = 0, n = random.nextInt(100); i & i++) {
g.fillRect(random.nextInt(width), random.nextInt(height), 1, 1);
// 将图像输出到浏览器
ServletOutputStream outstream = response.getOutputStream();
JPEGImageEncoder encoder = JPEGCodec.createJPEGEncoder(outstream);
encoder.encode(bimage);
outstream.flush();
outstream.close();
3，服务器对于Ajax请求是如何处理的呢?即validateServlet
import java.io.IOE
import java.io.PrintW
import javax.servlet.ServletE
import javax.servlet.ServletOutputS
import javax.servlet.http.HttpS
import javax.servlet.http.HttpServletR
import javax.servlet.http.HttpServletR
public class validateServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String validate= request.getParameter("validate");
String randomString=(String)request.getSession(true).getAttribute("randomString");
PrintWriter out=response.getWriter();
if(validate.equalsIgnoreCase(randomString)){
out.write("true");
out.write("false");
DxnPratice
浏览: 8606 次
来自: 长沙
(window.slotbydup=window.slotbydup || []).push({
id: '4773203',
container: s,
size: '200,200',
display: 'inlay-fix'