AJAX的使用方法-创新互联

创新互联www.cdcxhl.cn八线动态BGP香港云服务器提供商，新人活动买多久送多久，划算不套路！

成都创新互联公司主要从事成都网站设计、网站建设、网页设计、企业做网站、公司建网站等业务。立足成都服务上党,十年网站建设经验,价格优惠、服务专业,欢迎来电咨询建站服务:13518219792

今天就跟大家聊聊有关AJAX的使用方法，可能很多人都不太了解，为了让大家更加了解，小编给大家总结了以下内容，希望大家根据这篇文章可以有所收获。

ajax简介：

AJAX（Asynchronous Javascript And XML）翻译成中文就是“异步的Javascript和XML”。即使用Javascript语言与服务器进行异步交互，传输的数据为XML（当然，传输的数据不只是XML）。

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

AJAX 大的优点是在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。（这一特点给用户的感受是在不知不觉中完成请求和响应过程）

AJAX 不需要任何浏览器插件，但需要用户允许JavaScript在浏览器上执行。

同步交互：客户端发出一个请求后，需要等待服务器响应结束后，才能发出第二个请求；

异步交互：客户端发出一个请求后，无需等待服务器响应结束，就可以发出第二个请求。

ajax的基本使用方法：

# 前端向后端请求方式：1 浏览器手动输入网址（get请求），2 a标签的href属性（get请求），form表单（get/post请求，默认为get）

# ajax特点：异步提交、局部刷新

# 基本使用语法：

　　提交url   （url：’...‘）

　　提交方式  （type: 'post')

　　提交数据  (data:{'''})

　　提交后通过回调函数得到的返回结果  (sucess:function(data){...})

# 基本使用示例：（ajax的默认传输数据的格式是urlencoded）

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>图书管理系统</title>
    <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
    <link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.min.css">
    <script src="/static/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="/static/layui/css/layui.css">
    <script src="/static/layui/layui.js"></script>
    <script src="https://cdn.bootcss.com/sweetalert/2.1.2/sweetalert.min.js"></script>
</head>
<body>
<button class="btn btn-success" id="b1">AJAX测试</button>
<script>
    {#绑定按钮点击触发ajax提交数据#}
    $('#b1').on('click', function () {
        $.ajax({    {#固定语法格式#}
            url: '',  {#不写默认朝当前页面发请求#}
            type: 'post',   {#请求方式#}
            data : {'name': 'sgt', 'pwd': '123'},    {#发送的请求数据#}
            {#这里的data就是回调函数success获取到的后端响应返回的数据#}
            success:function (data) {
                swal({
                    title: 'AJAX',
                    text: '模拟这里显示了返回的数据',
                    icon: 'success',
                    button: 'OK',
                    })
            }
        })
    })
</script>
</body>
</html>

 我们知道ajax默认的传输数据格式是urlencoded，前面我们说过，ajax可以用json作为数据格式传输。

现在强调一点：前后端传输数据必须要求数据是什么格式就应该用对应的传输格式，一一对应去传输，否则Django解析数据出问题，以至于我们在前后端拿不到想要的数据。

所以：

第一：我们需要在ajax发送请求代码中指定发送数据格式：

contentType: 'application/json',

第二：后端获取json格式数据不再是request.POST,而是通过request.body(得到的是一个bytes类型的json格式数据），所以再处理一下：

res = json.loads(request.body.decode('utf-8')),这就得到前端ajax发送过来的json格式数据。

看完上述内容，你们对AJAX的使用方法有进一步的了解吗？如果还想了解更多知识或者相关内容，请关注创新互联-成都网站建设公司行业资讯频道，感谢大家的支持。

文章名称：AJAX的使用方法-创新互联
文章来源：https://www.cdcxhl.com/article46/pdihg.html

成都网站建设公司_创新互联，为您提供微信小程序、网站改版、小程序开发、网站设计、网站设计公司、ChatGPT

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联

猜你还喜欢下面的内容

成都网站建设公司

解决方案知识

分类信息网