爱奥娱乐

全部频道

您的当前位置：首页jQuery+Ajax实现无刷新操作_jquery

jQuery+Ajax实现无刷新操作_jquery

来源：爱奥娱乐


使用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登录，很简单吧？ 




        
                
            
            
            
    
显示全文