jquery-ajax数据交换

来源：互联网发布：什么是淘宝店铺推广编辑：程序博客网时间：2024/05/17 23:20
<script>    $(function () {        //方法1：使用ajaxStart方法定义一个全局的“加载中...”提示        //注意：所有的ajax提交都会触发ajaxStart事件，都会在你定义的<div id="loading"></div>        $("#loading").ajaxStart(function(){            //$(this).html.("<img src='loading.gif' />");        });        $("#loading").ajaxSuccess(function(){            //$(this).html.("");            // $(this).empty(); // 或者直接清除        });        //ajax        $('.btn').click(function () {            //提交数据            var username = $('.username').val();            var email = $('.email').val();            $.ajax({                url:'userdata.json',                type:'POST',                async:true,//默认值: true;是否异步                cache:true,//默认值: true，dataType 为 script 和 jsonp 时默认为 false。设置为 false 将不缓存此页面。                //默认值: "application/x-www-form-urlencoded"。发送信息至服务器时内容编码类型。默认值适合大多数情况。                contentType:'application/x-www-form-urlencoded',                data:{                    name:username,                    email:email                },                timeout:5000,    //超时时间                dataType:'json', //返回的数据格式：json/xml/html/script/jsonp/text                beforeSend:function(xhr){                    console.log(xhr);                    console.log('发送前');                    //定义loading                    $('.ul-box').append('<span class="loading">发送中...</span>')                },                success:function(data,textStatus,jqXHR){                    $('.loading').remove();                    console.log(data);                    console.log(textStatus);                    console.log(jqXHR);                    //前端输出数据                    var resdata = data;                    //遍历json数组                    $.each(resdata,function(index,val){                        var html = '<tr>' +                                '<td>'+val.username+'</td>' +                                '<td>'+ val.emain +'</td>' +                                '</tr>';                        $('.ul-box').append(html);                    })                },                error:function(xhr,textStatus){                    console.log('错误');                    console.log(xhr);                    console.log(textStatus);                    $('.ul-box').append('错误');                    $('.loading').remove();                },                complete:function(){                    console.log('结束');                }            })        });    })    //post方式：    function ispassword() {        var username = $("#username").val();        var password = $("#password").val();        $.post("url", {                    "password": password,                    "username": username                },                function(result) {                    if ($.trim(result) == "true") {                        $("#msg2").html("密码正确");                    } else {                        $("#msg2").html("密码错误");                    }                },                'json'        );    }    //get方式：    function ispassword() {        var username = $("#username").val();        var password = $("#password").val();        $.get("url", {                    "password": password,                    "username": username                },                function(result) {                    if ($.trim(result) == "true") {                        $("#msg2").html("密码正确");                    } else {                        $("#msg2").html("密码错误");                    }                },                'json'        );    }    //ajax方式---post提交json格式数据    $(function() {        $('.login').click(function() {            var username = $("#username").val();            var password = $("#password").val();            var jsondata = {username:'',password:''};            $.ajax({                type: "post",                contentType: "application/json",                url: "",                timeout:5000,                dataType:'json',                /*                 contentType: "application/json",                 data: JSON.stringify(datajson),                 * */                data: "{username:'" + username + "',password:'" + password + "'}",                success: function(result) {                    console.log('成功');                    console.log(result);                },                error:function(xhr,textStatus){                    console.log('错误');                    console.log(xhr);                    console.log(textStatus);                }            })        })    })</script>
0 0