Ajax入门学习

2016-12-02 08:02:00来源:CSDN作者:qq_33665647人点击

第七城市

Ajax主要来实现局部刷新的。

这是一个项目:

AjaxTest.java(Servlet)

import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import java.io.IOException;import java.io.PrintWriter;/** * Created by Administrator on 2016/12/1. */public class AjaxTest extends HttpServlet {    @Override    public void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {        PrintWriter out = resp.getWriter();       String name= req.getParameter("name");       if(name==null||name.equals(""))       {            out.println("please input username");       } else if(name.equals("wh")){           out.println("welcome "+name);       }else{            out.println("the user doesn't esist!");       }    }    @Override    public  void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {     doGet(req, resp);    }}
ajax.html(填写数据,展示页面)

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title>    <script  type="text/javascript" src="jquery-3.1.1.js"></script>    <script  type="text/javascript" src="verify.js"></script></head><body>使用ajax技术处理<input type=text" id="input" name="name" /><input type="button" value="校验" onclick="verify()"/><div id="result"></div></body></html>
verify.js

function  verify() {    var input = $("#input");    var username = input.val();    $.get("AjaxTest?name="+username,null,callback);}function callback(data){    var res=$("#result");    res.html(data);}
每点击一下按钮,就会调用verify函数,从Servlet调出数据,显示在div里。


    




第七城市

最新文章

123

最新摄影

微信扫一扫

第七城市微信公众平台