zoukankan      html  css  js  c++  java
  • js中get与post实现

    1、get

    <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
    <head>
        <title>Title</title>
        <script type="text/javascript">
            function checkusername() {
                // 1.获取ajax引擎
                var xhr = getXHR();
    
                // 2.调用open方法准备发送
                var url = 'checkUsername_ajax?username='+document.getElementById('username').value;
                console.log(url);
                xhr.open('get',url,true);
    
                // 3.发送请求
                xhr.send();
    
                // 4.指定回调函数
                xhr.onreadystatechange = function () {
                    // readystate是4并且status是200
                    if(xhr.readyState == 4 && xhr.status == 200){
                        document.getElementById("msg").innerHTML = xhr.responseText;
                    }
                };
            }
            
            function getXHR() {
                if(window.XMLHttpRequest)
                {
                    return new window.XMLHttpRequest();
                } else {
                    return new window.ActiveXObject("Microsoft.XMLHTTP");
                }
            }
        </script>
    </head>
    <body>
        <form action="" method="get">
            <input type="text" name="username" id="username" onblur="checkusername()"/><br/><div id="msg"></div>
            <input type="text" name="address"/><br/>
            <input type="submit" value="login"/><br/>
        </form>
    </body>
    </html>

    2、post

    <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
    <head>
        <title>Title</title>
        <script type="text/javascript">
            function checkusername() {
                // 1.获取ajax引擎
                var xhr = getXHR();
    
                // 2.调用open方法准备发送
                xhr.open('post','checkUsername_ajax',true);
    
                // 3.发送请求 (多个参数使用&符号连接)
                // xhr.send('username='+document.getElementById('username').value+'&address=nj');
                xhr.send('username='+document.getElementById('username').value);
    
                // 4.指定回调函数
                xhr.onreadystatechange = function () {
                    // readystate是4并且status是200
                    if(xhr.readyState == 4 && xhr.status == 200){
                        document.getElementById("msg").innerHTML = xhr.responseText;
                    }
                };
            }
            
            function getXHR() {
                if(window.XMLHttpRequest)
                {
                    return new window.XMLHttpRequest();
                } else {
                    return new window.ActiveXObject("Microsoft.XMLHTTP");
                }
            }
        </script>
    </head>
    <body>
        <form action="" method="get">
            <input type="text" name="username" id="username" onblur="checkusername()"/><br/><div id="msg"></div>
            <input type="text" name="address"/><br/>
            <input type="submit" value="login"/><br/>
        </form>
    </body>
    </html>

    文中checkUsername_ajax是url地址

  • 相关阅读:
    lintcode:previous permutation上一个排列
    lintcode : 二叉树的序列化和反序列化
    lintcode : find peak element 寻找峰值
    lintcode 中等题:搜索旋转排序数组II
    lintcode :搜索旋转排序数组
    lintcode: search for a range 搜索区间
    lintcode:最大子数组差
    lintcode:最大子数组II
    lintcode :最大子数组
    lintcode : 平衡二叉树
  • 原文地址:https://www.cnblogs.com/TaoYuanJieYi/p/12143097.html
Copyright © 2011-2022 走看看