zoukankan      html  css  js  c++  java
  • AJAX

    AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。

    AJAX 不是新的编程语言,而是一种使用现有标准的新方法。

    AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下。

      AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下。

    AJAX = 异步 JavaScript 和 XML。

    AJAX 是一种用于创建快速动态网页的技术。

    http://www.w3school.com.cn/ajax/index.asp

    在要刷新的页面input中动态更新

    <body

    <TR>
                                    <th width="20%" align="center">用户登录名</th>
                                    <TD class="BGCgray"><input name="ur_loginName" type="text"
                                        class="inputbox" id="ur_loginName"
                                        style="160px;hight:20px"
                                        value="${sessionScope.user.ur_loginName }" onblur="lnTest()"><span
                                        id="login" style="color:red"></span></TD>
                                </TR>

    </body>

    <script>

        function lnTest() {
            var ur_loginName = document.getElementById("ur_loginName").value;
            var login = document.getElementById("login");
            var id = "${sessionScope.user.ur_id}";
            var ymsz = /^[A-Za-z0-9]+$/;
            var loginname = document.getElementById("loginname").value;
            if(loginname==ur_loginName){
                return true;
            }else if (kong.test(ur_loginName)) {
                login.style.color = "red";
                login.innerHTML = " × 账户不可以为空";
                return  false;
            } else if (ymsz.test(ur_loginName)) {
                xml = new XMLHttpRequest();
                xml.open("get", "AJAXServlet.do", true);
                xml.setRequestHeader("name", ur_loginName);
                xml.setRequestHeader("ur_id", id);
                xml.send(null);
                xml.onreadystatechange = function(){                
                    if (xml.readyState == 4) {
                        var msg = xml.responseText;
                        var login = document.getElementById("login");
                        if (msg == 1) {
                            login.style.color = "red";
                            login.innerHTML = " × 该用户名已被使用";
                            return false;
                        } else if (msg != 1) {
                            login.style.color = "green";                
                            login.innerHTML = " √ 该用户名可以使用";
                            return true;
                        }
                    }
                    
                    
                };
            } else {
                login.style.color = "red";
                login.innerHTML = " × 账户格式不正确 ";
                return false;
            }
        }

    </script>

    使用ajax来在点击input框时,动态更新用户名,判断输入的用户名是否在原数据库中存在

    ajaxservlet.java

    package com.xxpx.servlet;

    import java.io.IOException;
    import java.io.PrintWriter;
    import java.util.ArrayList;
    import java.util.List;

    import javax.servlet.ServletException;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    import javax.servlet.http.HttpSession;

    import com.xxpx.bean.User;
    import com.xxpx.service.UserService;
    import com.xxpx.service.UserServiceImpl;

    public class AJAXServlet extends HttpServlet{

        UserService service = new UserServiceImpl();
        @Override
        protected void doGet(HttpServletRequest request, HttpServletResponse response)
                throws ServletException, IOException {
            // TODO Auto-generated method stub
            request.setCharacterEncoding("utf-8");
            response.setCharacterEncoding("utf-8");
            System.out.println("--->AJAX");        
            String id = request.getHeader("ur_id");        
            System.out.println("id="+id);
            List list1 = new ArrayList();
            list1.add(id);
            System.out.println("list1="+list1);
            HttpSession session = request.getSession();
            List<User> list = this.service.AjaxUser(list1);                
            String name = request.getHeader("name");
            System.out.println("name="+name);
            response.setContentType("text/html");
            PrintWriter out = response.getWriter();
            boolean flag = false;
            for(User a : list){
                System.out.println(a.getUr_loginName());
                if((a.getUr_loginName()).equals(name)){
                    flag = true;                
                }
            }
            if(flag == true ){
                out.print(1);
            }else{
                out.print(0);
            }
              out.flush();
              out.close();
        }

    }
    web.xml配置

    <display-name>AJAXTest</display-name>
      <servlet>
        <servlet-name>AJAXServlet</servlet-name>
        <servlet-class>com.xxpx.servlet.AJAXServlet</servlet-class>
      </servlet>
      <servlet-mapping>  
      <servlet-name>AJAXServlet</servlet-name>
      <url-pattern>/AJAXServlet.do</url-pattern>
      </servlet-mapping>
     
     

  • 相关阅读:
    MySQLdb 部署
    python 操作python
    python 面向对象(进阶篇)
    Python 面向对象(初级篇)
    Apache环境下强制http跳转至https的配置总结
    linux Apache设置https访问以及加载mod_ssl.so模块以及问题解决
    使用dd命令快速生成大文件或者小文件的方法
    Let’s Encrypt/Certbot移除/remove/revoke不需要的域名证书
    Vsphere中ESXi主机ssh开启的三种方法
    RackTables在LNMP系统的安装及使用
  • 原文地址:https://www.cnblogs.com/0280-hnn/p/6946133.html
Copyright © 2011-2022 走看看