AJAX学习笔记之JQ使用方法

来源:互联网 发布:学淘宝美工视频教程 编辑:程序博客网 时间:2024/05/20 05:09

首先在src文件下写好servlet,命名为ajax_Serve:

import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import javax.servlet.ServletException;import java.io.IOException;import java.io.PrintWriter;import java.net.URLDecoder;public class ajax_Server extends HttpServlet{protected void doPost(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse){doGet(httpServletRequest,httpServletResponse);}protected void doGet(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse){try{httpServletResponse.setContentType("text/html;charset=utf-8");PrintWriter out = httpServletResponse.getWriter();String old = httpServletRequest.getParameter("name");if(old == null || old.length() == 0){out.println("用户名不能为空");}else{String name = old;if(name.equals("123")){out.println("用户名["+name+"]已经存在");}else{out.println("用户名["+name+"]未存在");}}}catch(Exception e){e.printStackTrace();}}}


设置好之后,编写web.xml文件:

<?xml version="1.0" encoding="UTF-8"?><web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">  <display-name></display-name>  <welcome-file-list>    <welcome-file>ajax.html</welcome-file>  </welcome-file-list>    <servlet>  <servlet-name>ajax_Server</servlet-name>  <servlet-class>ajax_Server</servlet-class>  </servlet>   <servlet-mapping>  <servlet-name>ajax_Server</servlet-name>  <url-pattern>/ajax_Server</url-pattern>  </servlet-mapping> </web-app>

编写html文件:

<!DOCTYPE html><html>  <head>    <title>ajax.html</title><script type="text/javascript" src="js/jquery-1.11.2.min.js"></script><script type="text/javascript" src="js/ajax.js"></script>    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">    <meta http-equiv="description" content="this is my page">    <meta http-equiv="content-type" content="text/html; charset=GB18030">        <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->  </head>    <body>    This is a ajax's test <br>    <input type="text" id="user_Name" />    <input type="button" id="button" value="校验"  />    <div id="result"></div>  </body></html>
编写js文件:

$(function(){$("#button").click(function(){verify();});});function verify(){$.get("ajax_Server?name="+$("#user_Name").val(),null,function(data){//匿名函数的写法$("#result").html(data);});}

写完之后,就可以愉快的运行啦

0 0
原创粉丝点击