zoukankan      html  css  js  c++  java
  • 1.ajax简单实现异步交互

    效果:点击获取信息

    testAjax.jsp:

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Insert title here</title>
    <script type="text/javascript">
        function getName(){
            var xmlHttp;
            //判断浏览器是否兼容
            if(window.XMLHttpRequest){
                xmlHttp = new XMLHttpRequest();
            }else{
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlHttp.onreadystatechange = function(){
                //判断返回状态
                if(xmlHttp.readyState == 4 && xmlHttp.status == 200){
                    document.getElementById("name").value = xmlHttp.responseText;
                }
                
            }
            xmlHttp.open("get","getAjaxName",true);
            xmlHttp.send();
            
        }
    </script>
    </head>
    <body>
    <div style="text-align:center;">
        <input type="button" value="获取ajax信息" onclick="getName()"><input type="text" name="name" id="name">
    </div>
    </body>
    </html>

    GetAjaxNameServlet.java

    package com.xxc.ajax;
    
    import java.io.IOException;
    import java.io.PrintWriter;
    
    import javax.servlet.ServletException;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    
    public class GetAjaxNameServlet extends HttpServlet{
    
        /**
         * 
         */
        private static final long serialVersionUID = 1L;
        @Override
        protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
            // TODO Auto-generated method stub
            this.doPost(req, resp);
        }
        @Override
        protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
            resp.setContentType("text/html;charset=utf-8");
            PrintWriter out = resp.getWriter();
            out.println("返回的信息");
            out.flush();
            out.close();
        }
    
    }

    web.xml

    <servlet>
          <servlet-name>GetAjaxNameServlet</servlet-name>
          <servlet-class>com.xxc.ajax.GetAjaxNameServlet</servlet-class>
      </servlet>
      <servlet-mapping>
          <servlet-name>GetAjaxNameServlet</servlet-name>
          <url-pattern>/getAjaxName</url-pattern>
      </servlet-mapping>

  • 相关阅读:
    深入理解分布式事务,高并发下分布式事务的解决方案
    Java互联网架构-Mysql分库分表订单生成系统实战分析
    PowerDesigner 表格导出为excel
    并行(多进程)-python
    使用caffe模型测试图片(python接口)
    评估模型-二分类
    python-字符编码
    python-随机操作(random)
    目标检测-yolo2
    tensorflow-安装
  • 原文地址:https://www.cnblogs.com/alex-xxc/p/10011283.html
Copyright © 2011-2022 走看看