js解析文本、xml格式、json数据与ajax和servlet交互及乱码解决

时间：2014-12-18 编辑：简简单单来源：一聚教程网

1,在ajax与后台的交互中经常会出现乱码,

解决办法: 在后台获取数据的时候要改变其编码

//获取jsp页面传递过来的userName

代码如下	复制代码
String user= request.getParameter("userName"); //使用String来改变获取到的字符集编码 String userid = new String(user.getBytes("iso8859-1"),"GBK");

2,XMLHttpRequest实现Ajax局部更新效果

Ajax用于数据的更新等操作

xmlHttpRequest的属性和方法

方法描述

abort()停止当前请求

getAllResponseHeaders()把HTTP请求的所有响应首部作为键/值对返回

getResponseHeader("header")返回指定首部的串值

open("method", "url")建立对服务器的调用。method参数可以是GET、POST或PUT。url参数可以是相对URL或绝对URL。这个方法还包括3个可选的参数

send(content)向服务器发送请求

setRequestHeader("header", "value")把指定首部设置为所提供的值。在设置任何首部之前必须先调用open()

属性描述

onreadystatechange每个状态改变时都会触发这个事件处理器，通常会调用一个JavaScript函数

readyState请求的状态。有5个可取值：0 = 未初始化，1 = 正在加载，2 = 已加载，3 = 交互中，4 = 完成

responseText服务器的响应，表示为一个串

responseXML服务器的响应，表示为XML。这个对象可以解析为一个DOM对象

status服务器的HTTP状态码(200对应OK，404对应Not Found(未找到)，等等)

statusTextHTTP状态码的相应文本(OK或Not Found(未找到)等等)

使用XMLHttpRequest实现Ajax效果思路;

1,创建XMLHttpRequest

2,创建回调函数callback

3,设置请求的路径

4,发送数据

5,回调函数中判断是否交互完成,是否找到页面,接受servlet返回的数据

代码实现:

Servlet代码:记得web.xml中配置

代码如下

复制代码

package ajaxDemo;

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;

/**
*
* @author Administrator 通过局部刷新来实现数据的查找Ajax
*/
public class AjaxServlet extends HttpServlet {

    @Override
    protected void doPost(HttpServletRequest request,
            HttpServletResponse response) throws ServletException, IOException {
        doGet(request, response);
    }

    @Override
    protected void doGet(HttpServletRequest request,
            HttpServletResponse response) throws ServletException, IOException {
        PrintWriter out = response.getWriter();
        response.setContentType("text/html");
        request.setCharacterEncoding("GBK");
        response.setCharacterEncoding("GBK");
        //获取url传递的参数
        String userName = request.getParameter("userName");
        System.out.println(userName);
        //假设连接上数据库,判断并给予返回值 ,ok表示可以注册,ON表示不可以注册
        if ("123".equals(userName)) {
            out.write("ON");
        } else {
            out.write("OK");
        }
    }
}

注意:(重点)

Jquery和Ajax实现局部更新;需要引Jquery的包

ajax提交数据不需要通过form表单提交,不需要submit,

需要自己获取表单框中的值,

Html代码

代码如下	复制代码
用户名: 密码:

Jquery+ajax关键代码:
Jquery+ajax代码

代码如下	复制代码

运行结果:

账号存在

账号不存在

3,js解析xml格式的数据例子: xml动态检查用户名是否存在

后台代码:

Java代码

代码如下

复制代码

/**xml传递数据
*
* @author Administrator 通过局部刷新来实现数据的查找Ajax
*/
public class AjaxServlet extends HttpServlet {

    @Override
    protected void doPost(HttpServletRequest request,
            HttpServletResponse response) throws ServletException, IOException {
        doGet(request, response);
    }

    @Override
    protected void doGet(HttpServletRequest request,
            HttpServletResponse response) throws ServletException, IOException {
        //xml传递数据:response.setContentType("text/xml");必须是xml的

        response.setCharacterEncoding("GBK");
        request.setCharacterEncoding("GBK");
        PrintWriter out = response.getWriter();
        response.setContentType("text/xml");
        //获取url传递的参数
        //解决js与servlet之间数据的乱码问题
        String userName = request.getParameter("userName");
        String str =new String(userName.getBytes("iso8859-1"),"GBK");
        System.out.println(str);

        //修改点二:xml的返回格式必须是有开始和结束的
        StringBuffer buffer = new StringBuffer();
        buffer.append("");
        //假设连接上数据库,判断并给予返回值 ,ok表示可以注册,ON表示不可以注册
        if ("123".equals(str)) {
            buffer.append(str +"用户名已存在").append("");
        } else {
            buffer.append(str +"可以注册!!!").append("");
        }
        //输出StringBuffer字符串
        out.print(buffer);
    }

}

jsp界面代码

Jsp代码

代码如下

复制代码

3,js解析json数据; json格式动态检查用户名是否存在

后台关键代码;

Java代码

代码如下

复制代码

//接受数据
String user= request.getParameter("userName");
String userid = new String(user.getBytes("iso8859-1"),"GBK");

System.out.println(userid);
      //创建java转json的数据对象
      String jsonstr="{}";
      JSONObject jsonsql = JSONObject.fromObject(jsonstr);
            //00001
            // id: 1 2 3
            // menu: 工资   奖金   会议室的申请
            // href: salary.jsp money.jsp meetingRoom.jsp
      //存储Jsonobject对象的队列
      ArrayList jsonlist= new ArrayList();
      try {
      //连接数据库查询用户的权限
      Connection conn=DBUilt.getConn();
      String consql =" select parentnode, menuname,menuhref from role_menu where parentnode   in (select menuid from role_role where userid=?)";
PreparedStatement pstm=conn.prepareStatement(consql);
pstm.setString(1, userid);
ResultSet rs=pstm.executeQuery();
while( rs.next()){
    //创建java转json的对象
    JSONObject pstmjson = JSONObject.fromObject(jsonstr);
    pstmjson.put("id", rs.getString(1));
    pstmjson.put("menu", rs.getString(2));
    pstmjson.put("href", rs.getString(3));
    jsonlist.add(pstmjson); //创建json队列存放数据库取出来的对象
}
rs.close();
} catch (Exception e) {
e.printStackTrace();
}
      //写到jsp页面
     out.write(jsonlist.toString());

jsp前台代码;

Java代码

代码如下	复制代码
用户名: 密码:

上一个： jQuery中noConflict解决冲突问题
下一个： jsp+ajax发送GET、POST请求教程

推荐专题

最新下载

热门教程

js解析文本、xml格式、json数据与ajax和servlet交互及乱码解决

相关文章

热门栏目

php教程

asp.net教程

手机开发

css教程

网页制作

办公数码

jsp教程