乐趣区

关于ajax:ajax的常用函数

jiezi

<!DOCTYPE html>
<html>
<head>
<meta charset=”UTF-8″>
<title>Insert title here</title>
</head>
<body>

<h1>The Jquery ajax</h1>
<fieldset>
    <legend>jquery</legend>
    <button onclick="doGet()">$get(...)</button>
    <form>
        输出:<input type="text" name="name"> <input type="button"
            onclick="doPost()" value="提交">
    </form>

    <span id="resultId"></span>
</fieldset>
<!-- 引入 jquery 包 -->
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript">
    
    1. 这个是 get 提交函数；function doGet() {
        // 申请 url
        var url = "/jquery/doAjaxGet";
        // 申请参数
        var params = "msg=hello jquery ahax get method";// 将代码转为大写的字母
        // 发送异步申请
        $.get(url, params, function(result) {//document.querySelector("#resultId").innerHTML =result;
            $("#resultId").html(result);//
        })
    }
    
   
   2.post 提交函数
    function doPost() {
        // 申请 url
        var url = "/jquery/doAjaxPost";
        // 申请参数
        var name = document.forms[0].name.value;// 获取 name 的值；var params = "name=" + name;// 将代码转为大写的字母
        // 发送异步申请
        $.post(url, params, function(result) {//document.querySelector("#resultId").innerHTML =result;
            $("#resultId").html(result);//
        })
    }

    
    
    3. 这个是 ajax 提交函数
    function doAjax() {
        //1. 定义申请的 url
        var url = "doAjaxGet";
        //2. 定义申请的参数
        var params = "msg=hello jquery ajax request";
        //3. 发送异步 Get 申请
        // 这里的 $ 符号为 jQuery 中的一个对象
        $.ajax({
            // 右边的货色是零碎定义的不能轻易乱改；type : "GET",// 能够省略默认为 get 申请
            url : url,
            data : params,// 无需向服务端传参时能够不写
            async : true,// 能够补写（由 ajax 函数 neibu 基于返回值进行匹配解决）success : function(result) { // 解决服务端返回的失常信息
                $("#result").html(result);
            },
            error : function(xhr) {// 解决服务端返回的异样信息
                console.log(xhr.statusText);
                $("#result").html(xhr.statusText);
            }
        })
    }
    
    
   
   4. 这个是 load 提交函数
    function doLoad() {
        //1. 定义申请的 url
        var url = "doAjaxGet";
        //2. 定义申请的参数
        var params = "msg=hello jquery ajax request";
        //3. 发送异步 Get 申请
        // 通过 load 函数向服务端发送异步申请，将服务端响应的后果异步更新到
        //resultId 对应的地位
        $("#result").load(url);//
    }
    
</script>

</body>
</html>

退出移动版