博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
AJAX与servlet的组合,最原始的
阅读量:5089 次
发布时间:2019-06-13

本文共 4427 字,大约阅读时间需要 14 分钟。

function getXhr(){  var xhr;    if(window.XMLHttpRequest){    //非ie浏览器      xhr = new XMLHttpRequest();    }else{    //ie      xhr = new ActiveXObject('Microsoft.XMLHttp');    }    return xhr;}

上面这段代码是写在JS里的,用来返回AJAX对象。下面来一段JSP里的代码。

<%@page pageEncoding="utf-8"  contentType="text/html;charset=utf-8" %>                                    
注册 用户名:
密码:

再看看servlet里面怎么写:

import java.io.IOException;import java.io.PrintWriter;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;public class ActionServlet extends HttpServlet {        public void service(HttpServletRequest request, HttpServletResponse response)            throws ServletException, IOException {        response.setContentType("text/html;charset=utf-8");        PrintWriter out = response.getWriter();        String uri = request.getRequestURI();        String action = uri.substring(uri.lastIndexOf("/"),uri.lastIndexOf("."));        if(action.equals("/check_username")){            String username = request.getParameter("username");            if(username.equals("zs")){                out.println("用户名已经被占用");            }else{                out.println("用户名可以使用");            }        }        out.close();    }}

 

 都完事了吧,来段点AJAX知识

1、ajax是什么?    asynchronous javascript and xml:异步的javascript和xml。        是一种用来改善用户体验的技术,其本质是利用    浏览器内置的一种特殊的对象(XMLHttpRequest)异步    (即发送请求时,浏览器不会销毁当前页面,用户    可以继续在当前页面做其它的操作)的向服务器发送    请求,并且利用服务器返回的数据(不再是一个完整的    页面,只是部分的数据,一般使用文本或者xml返回)    来部分更新当前页面。        使用ajax技术之后,页面无刷新,并且不打断用户    的操作。2、ajax对象    (1)如何获得ajax对象?        XMLHttpRequest并没有标准化,要区分浏览器:        function getXhr(){            var xhr;            if(window.XMLHttpRequest){                //非ie浏览器                xhr = new XMLHttpRequest();            }else{                //ie                xhr = new ActiveXObject('Microsoft.XMLHttp');            }        }        (2)ajax对象的属性            a, onreadystatechange : 绑订一个事件处理            函数(注册监听器),当ajax对象的readyState            值发生了改变(比如,从0-->1),就会产生            readystatechange事件。            b, responseText: 获得服务器返回的文本            c, responseXML:获得服务器返回的xml数据            d, status:获得状态码            e, readyState:ajax对象在与服务器进行通讯时,        通过readyState属性值可以获取该对象的通讯的状态,        其属性有5个(0,1,2,3,4),当属性值为4时,表示ajax        对象已经获得了服务器返回的所有的数据。        (3)ajax编程的基本步骤            step1, 先获得ajax对象            var xhr = getXhr();            step2, 发送请求                xhr.open(请求方式,请求地址,异步还是同步);                请求方式: get/post                请求地址:如果是get请求,请求参数要添加到                请求地址的后面。                true表示异步请求 :ajax对象发请求的同时,用户                可以对当前页面做其它的操作。                false表示同步请求:ajax对象发请求的同时,浏览器                会锁订当前页面,用户需要等待处理完成之后才                能做下一步操作。                方式一:get请求                xhr.open('get',                'check_username.do?username=zs',true);                xhr.onreadystatechange=f1;                xhr.send(null);                方式二:post请求                xhr.open('post');            step3,编写服务器端的代码,服务器端一般不需要            返回完整的页面,只需要返回部分的数据,比如一个            简单的字符串。            step4, 编写监听器                function f1(){                    if(xhr.readyState == 4){                        //获得服务器返回的数据                        var txt = xhr.responseText;                        //dom操作                    }                }

 

1、ajax编程中的编码问题    (1)发送get请求:        ie浏览器内置的ajax对象,对中文参数使用gbk编码,    而其它浏览器(firefox,chrome)使用utf8编码。        服务器端默认使用iso-8859-1去解码。    解决方案:        step1,让服务器对get请求中的参数使用指定的编码        格式进行解码。            比如,对于tomcat,可以修改 conf/server.xml        URIEncoding="utf-8"        step2,对请求地址,使用encodeURI函数进行统一的        编码(utf-8)    (2)发送post        所有浏览器内置的ajax对象都会使用utf-8进行编码。        解决方案:                request.setCharacterEncoding("utf-8");2、发送post请求        xhr.open('post','check_username.do',true);        xhr.setRequestHeader('content-type',        'application/x-www-form-urlencoded');        xhr.onreadystatechange=f1;        xhr.send('username=' + $F('username'));    注意:            因为按照http协议的要求,如果发送的post请求,        请求数据包里面,应该有一个消息头 content-type。        但是,ajax对象默认没有,所以,需要调用        setRequestHeader方法。

 

转载请标明出处

 

转载于:https://www.cnblogs.com/coolgame/p/3315381.html

你可能感兴趣的文章
centos下面配置key登录
查看>>
javascript小练习(1)
查看>>
TP5中文件的写入路径有的会被自动重定向到首页
查看>>
Oracle 通用分页存储过程
查看>>
《C++ Primer 4th》读书笔记 第4章-数组和指针
查看>>
手把手教你做关键词匹配项目(搜索引擎)---- 第二十二天
查看>>
Java类加载过程
查看>>
vue----封装长按指令
查看>>
ElasticSearch5.2.2 安装配置
查看>>
python之数据结构链表实现方式
查看>>
Co. - VMware - vSphere
查看>>
java02实验:方法
查看>>
Qt样式表之一:Qt样式表和盒子模型介绍
查看>>
自定义HTML标签属性
查看>>
USACO 5.3 Window Area
查看>>
_CRT_NONSTDC…与_CRT_SECURE…
查看>>
图标字体的使用(fontello.com)字体推荐及使用技巧
查看>>
Asp.Net_ 服务端向客户端写JavaScript脚本
查看>>
DirectX11--深入理解与使用2D纹理资源
查看>>
针对WebLogic Server 12.1.3版本打补丁
查看>>