当前位置:Gxlcms > JavaScript > jQuery+Ajax实现无刷新操作_jquery

jQuery+Ajax实现无刷新操作_jquery

时间:2021-07-01 10:21:17 帮助过:233人阅读

使用jQuery实现Ajax操作
想要实现Ajax页面无刷新效果,但是直接利用Ajax代码实在有些麻烦,所以就想用jQuery实现。jQuery很好的封装了Ajax的核心对象XMLHTTPRequest。所以用起来非常方便。
首先,创建服务器端代码,这里用Servlet实现服务器端的数据处理;代码如下:

输出对象 PrintWriter out = resp.getWriter(); // 得到请求参数 String name = req.getParameter("uname"); // 判断 if (name == null || name.length() == 0) { out.println("用户名不能为空!"); } else { // 判断 if (name.equals("cheng")) { out.println("用户名["+ name +"]已存在!请使用其他用户名!"); } else { out.println("用户名[" + name + "]尚未存在!您可以注册!"); } } }

然后,创建JSP页面,要使用jQuery,必须在页面之中引入jQuery库,也就是一个Javascript文件,另外还需引入自定义的Javascript文件,如下:

而JSP页面只需要一个文本框、一个普通按钮和一个空白DIV层即可,该DIV用于显示服务器端返回的处理结果;按钮的单击事件触发verify()方法。如下:

 
 
用户名:

注意:Ajax方式下不需要使用表单来进行数据提交,因此页面中不用写

分别在前台aspx页面和后台ashx页面中输入如上代码,就实现了一个超级简单的Ajax登录,很简单吧?

人气教程排行