• 初始Ajax学习笔记


    前端:

    <!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"
                };
                //将这个值传递到java后台
                $.ajax({                                //通过jquery调用ajax方法,触发ajax请求
                    url:'/web10/testAjax1',                //url表示请求会发送到哪个后端地址
                    //data:'value='+a,                    //通过data封装参数
                    data: user,//通过对象传参
                    type:'get',                            //type表示发送到后端的请求类型:Get、Post、Put、Delete等等
                    dataType:'text',                    //dataType表示服务端响应数据的类型:HTML、text、json等
                    success:function(msg){                //success表示请求发送成功之后的回调函数
                                                        //msg表示服务端发送到前端的数据
                        alert(msg);
                    },
                    error:function(){                     //error,表示程序调用有误
                        alert('错误');
                    }
                });    
            });
                
        </script>
        
    </body>
    </html>

    后台:

    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();
        }
    
        
    }
  • 相关阅读:
    看了前辈缠中说禅及其反响,忍不住想说些东西
    利弗莫尔的操盘精华篇
    缠中说禅:教你炒股票108课(转载)
    评温斯坦的炒股书(非常重要,常看看)
    本散女2
    使用PHP-GTK编写一个windows桌面应用程序
    php.exe php-cgi.exe php-win.exe的区别
    php调试利器之phpdbg
    yaf框架安装配置
    phalcon框架安装
  • 原文地址:https://www.cnblogs.com/zhf123/p/12082574.html
Copyright © 2020-2023  润新知