zoukankan      html  css  js  c++  java
  • ajax初体验hello_ajax

    一个简单的springMVC项目

    使用的是jquery

    实现效果,只有一个输入框,当鼠标离开输入框,后台实现数据交互,并且返回数据

    如果输入的是cong,弹窗false,如果输入的是其他的,弹窗false

    controller

    @Controller
    @RequestMapping("/ajax")
    public class AjaxController {
        @RequestMapping("/a1")
        public void ajax(String name, HttpServletResponse response) throws IOException {
            System.out.println("ajax:name -> " + name);
            if("cong".equals(name)){
                response.getWriter().print("true");
            }else {
                response.getWriter().print("false");
            }
        }
    }

    index.jsp

    <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
    <head>
        <title>Title</title>
        <%--<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>--%>
        <script src="${pageContext.request.contextPath}/statics/js/jquery-3.4.1.js"></script>
        <script>
            function a(){
    
                $.post({
                    url:"${pageContext.request.contextPath}/ajax/a1",
                    data:{"name":$("#username").val()},
                    success:function (data) {
                        alert(data);
                    }
                });
            }
    
        </script>
    </head>
    <body>
        <div style="margin-left: 200px">
            name:<input type="text" id="username" onblur="a()">
        </div>
    </body>
    </html>

    爱生活,爱码字

    我是匆匆、我曾喂自己半年酒。

    好好生活吧,有缘或许相见。

  • 相关阅读:
    让CEF支持FLASH(非安装插件的形式)
    解决SQLServer 2008 日志无法收缩,收缩后大小不改变
    HTML Socket实现 .NET
    JS基础之BOM对象
    JavaScript对象
    JS函数
    JavaScript概述
    CSS块级元素和行内元素
    返回顶部示例
    CSS属性操作二
  • 原文地址:https://www.cnblogs.com/ccoonngg/p/11915132.html
Copyright © 2011-2022 走看看