The initial study notes Ajax

front end:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <!--引入jquery文件-->
    <script src="js/jquery-3.2.1.js" type="text/javascript"></script>
</head>
<body>
    <div style="margin:100px;height:100px">
        <input>
    </div>
    <script type="text/javascript">
    
        $("input:eq(0)").on('change',function(){
            //获取input中的值
            var a = $(this).val();
            
            var user = {"name":a,
                        "age": 18,
                        "tel": "13611111111"
            };
            // This value is passed back to the java 
            $ .ajax ({                                 // by calling jquery ajax method triggering ajax request 
                URL: '/ web10 / testAjax1',                 // URL representing a request is sent to the address to which the rear end 
                // Data: 'value =' + a, // parameters through data encapsulation 
                data: User, // through the object by reference 
                type: 'GET',                             // type indicates the type of request sent to the backend: Get, Post, Put, Delete, etc. 
                dataType : 'text',                     // dataType server response represents a data type of: HTML, text, json like 
                success: function (MSG) {                 // success indicates callback request after successful 
                                                    @msg indicating the service sends the data to the front end of the 
                    Alert (msg); 
                }, 
                error: function () {                      // error, error indicates that the program calls the 
                    alert ( 'error' ); 
                } 
            });     
        });
            
     </ Script> 
    
< / body> 
</ HTML>

Backstage:

package com.zzb.servlet;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/testAjax1")
public class TestAjax1 extends HttpServlet{

    private static final long serialVersionUID = 3377241767636882169L;

    @Override
    protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        String name = request.getParameter("name");
        String age = request.getParameter("age");
        String tel = request.getParameter("tel");
        
        System.out.println("ajaxÇëÇóµ½´ï:"+name+":"+age+":"+tel);
        
        PrintWriter out = response.getWriter();
        
        out.write("success:"+name);
        
        out.close();
    }

    
}

Guess you like

Origin www.cnblogs.com/zhf123/p/12082574.html