" name="sm-site-verification"/>
侧边栏壁纸
博主头像
PySuper 博主等级

千里之行,始于足下

  • 累计撰写 206 篇文章
  • 累计创建 14 个标签
  • 累计收到 2 条评论

目 录CONTENT

文章目录

Ajax请求、POST / GET请求

PySuper
2019-10-29 / 0 评论 / 0 点赞 / 34 阅读 / 0 字
温馨提示:
本文最后更新于2024-05-28,若内容或图片失效,请留言反馈。 所有牛逼的人都有一段苦逼的岁月。 但是你只要像SB一样去坚持,终将牛逼!!! ✊✊✊

Ajax请求

用法一:

POST 请求

function check() {
 //定义变量sendData
 var sendData ={id:"123456",status:"222"};
 $.ajax({
  url:basePath + '/getUser',
  type:'post',
  dataType:'json',
  contentType:"application/json",
  async:true,//异步请求
  cache:false,
  data:JSON.stringify(sendData),//使用变量sendData
  //执行成功的回调函数
  success:function(data) {
   alert(data.info)
  },
  //执行失败或错误的回调函数
  error:function(data) {
   alert("认证失败");
  }
 });
}

GET 请求

<div class="layui-inline">
    <input class="layui-input" name="id" id="demoReload" autocomplete="off" placeholder="试验员姓名">
</div>
<button class="layui-btn" id="search-work" data-type="reload">搜索</button>

<script>
    $("#search-work").click(function () {
        var this_info = $("#demoReload").val()
        $.ajax({
            url: "/demo_ajax",
            datatype: "json",
            type: "GET",
            async: true, //异步请求
            data: {
                "info": this_info
            },
            success: function (e) {
                alert(e);
            },
            error: function (e) {
                alert(this_info);
            }
        });
    })
</script>

用法二(layui):

layer.open({
    type: 1,
    offset: "auto" //具体配置参考:http://www.layui.com/doc/modules/layer.html#offset
     ,id: 'LAY_demo' //防止重复弹出
     ,content: '<div style="padding: 20px 100px;">确认删除?</div>'
     ,btn: [ '确认', '取消']
     ,btnAlign: 'c' //按钮居中
     ,shade: 0.3 //不显示遮罩
     ,yes: function(){

      //定义变量sendData
         var sendData ={id:grid.id,user:grid.createUser};
      $.ajax({
       data: sendData,
       url:"account/delAccount",
       dataType: "json",
       type: 'POST',
       success:function(json) {
        layer.msg(json.msg);
        $('#table').bootstrapTable('refresh', {url:'account/query'});
       }
      }); 
      layer.closeAll();
     }
  ,btn2: function(index, layero){
     layer.closeAll();
}
   });

用法三:

$.ajax({
    url: url,
    data: $('#dirForm').serialize(),
    dataType: "html",
    type: "post",
    success: function(result) {
        $('#jumpbox').html(result);
        $('#jumpbox').modal('show');
    }
});

用法四:

$(function($) {
    $(".reset").click(function() {
        $("#search_form :text").val("");
        $("#search_form :radio:eq(0)").prop("checked", "checked");
        $("#search_form select option:eq(0)").prop("selected", "selected");
    });

    $(".delete").click(function() {
        var userId = $(this).data("userid");
        $('#sure_msg_body').html('确定要删除吗?此操作不可逆,请谨慎选择!');
        $('#sure_msgbox').modal('show');
        $("#sure_btn").unbind("click");
        $("#sure_btn").click(function() {
            $.ajax({
                url: "delete",
                data: {
                    userId: userId
                },
                dataType: "json",
                type: "post",
                success: function(data) {
                    if (data.status == "1") {
                        $('#msg_body').html('删除成功');
                        $('#msgbox').modal('show');
                        $("#msg_btn").click(function() {
                            window.location.href = "${stcds}/userManager/query";
                        });
                    } else {
                        if (typeof data.info == "object") {
                            $('#msg_body').html(data.info[0].defaultMessage);
                            $('#msgbox').modal('show');
                        } else {
                            $('#msg_body').html(data.info);
                            $('#msgbox').modal('show');
                        }
                    }
                }
            });
        });
    });
});

用法五:

$.ajax({
    url:"send/sendByIds",
    type:"POST",
    data:{
        ids: JSON.stringify(list)
    },
    dataType:"json",

    // 发送请求前调用的函数
    beforeSend:function(){
        isPost = true;
    },

    // 请求完成后回调函数 (请求成功或失败之后均调用)
    complete: function(XMLHttpRequest, textStatus){
        isPost = false;
    },
    success:function(data){
        layer.closeAll();
        layer.alert(data.msg);
        $('#table').bootstrapTable('refresh', {url:'send/querySendData'});
    },

    //调用出错执行的函数
    error: function(){
        layer.closeAll();
        //请求出错处理
        layer.alert("发放失败");
    }
});

POST请求

用法一:

$.post("${stcds}/dir/" + dirId + "/delete.msg", function(result) {
    $('#jumpbox').html(result);
    $('#jumpbox').modal('show');
});

用法二

$("input").keyup(function(){
    txt=$("input").val();
    $.post("demo_ajax_gethint.asp",{suggest:txt},function(result){
    $("span").html(result);
  });
});

JS常用操作

function clearValue(formId){
    $("#" +formId+ " input:text").val('');
    $("#" +formId+ " input:radio").attr('checked', false);
    $("#" +formId+ " input:checkbox").attr('checked', false);
    $("#" +formId+ " select").val('');
    $("#dirCode").val('');
} 
0
  1. 支付宝打赏

    qrcode alipay
  2. 微信打赏

    qrcode weixin

评论区