ajax抓取网页内容(Ajax技术将用户名设置为root,密码设置一致将提示密码错误)

　　ajax抓取网页内容(Ajax技术将用户名设置为root,密码设置一致将提示密码错误)

　　简要地

　　网页的局部刷新功能在网络上并不少见网站，比如实时新闻信息、股票信息等，都需要不断获取最新信息。在传统的web实现中，要达到类似的效果，必须刷新整个页面。在网速受到一定程度限制的情况下，这种因局部变化而影响整个页面的处理方式似乎有点吃亏。Ajax 技术的出现很好地解决了这个问题。使用Ajax技术可以实现网页的部分刷新，只更新指定的数据，不更新其他数据。本文通过一个登录案例来介绍ajax的使用。

　　登录html键码

账号：

密码：

登录

　　分析：在传统项目中，要向后台提交表单数据，我们都使用表单表单。这时候，使用ajax技术，我们将摒弃之前的表单提交方式。

　　ajax键码

$("#btn_login").click(function() {

$.ajax({

url : "login.do",

type : "post",

data : {

username : $("input[name=username]").val(),

password : $("input[name=password]").val()

},

dataType : "json",

success : function(result) {

var flag = result.flag;

if (flag == true) {

alert("密码正确！");

} else {

alert("密码错误！");

}

}

});

});

　　分析：使用ajax技术需要依赖jQuery，所以在使用ajax的时候需要引入jQuery包

　　ajax 语法特性

　　url：请求地址

type：传递方式(get/post)

data：用来传递的数据

success：交互成功后要执行的方法

dataType：ajax接收后台数据的类型

　　servlet 密钥代码

　　protected void doPost(HttpServletRequest req, HttpServletResponse resp)

throws ServletException, IOException {

//获取用户名和密码

String username = req.getParameter("username");

String password = req.getParameter("password");

//创建json对象

JSONObject jsonObject = null;

if ("root".equals(username) && "123456".equals(password)) {

jsonObject = new JSONObject("{flag:true}");

} else {

jsonObject = new JSONObject("{flag:false}");

}

//将数据返回给ajax

resp.getOutputStream().write(jsonObject.toString().getBytes("utf-8"));

}

　　分析：如图，我们将用户名设置为root，密码设置为123456，如果用户输入与设置一致，则提示密码正确，否则提示密码错误！

　　打开应用程序并阅读笔记