1. 简单的加法

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

</head>

<body>

<input type="text" name="a" id="a"><span>+</span><input type="text" name="b" id="b">

<button class="action">=</button>

<input type="text" name="sum" id="c">

<script src="jquery-3.2.1.min.js"></script>

<script>

    $(".action").click(function () {

        a = parseInt($("#a").val());

        b = parseInt($("#b").val());

        c=a+b;

        $.ajax($("#c").val(c))

    })

</script>

</body>

</html>

2.  用户登录验证

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

</head>

<body>

<a href="/get_OK/">点击</a><span class="error"></span>

<p>姓名：<input type="text" name="name"></p>

<p>密码：<input type="password" name="pwd"></p>

<span class="login_error"></span>

<p>

    <button class="Ajax_send">Ajax_send</button>

</p>

<script src="/static/jquery-3.2.1.min.js"></script>

<script>

    $(".Ajax_send").click(function () {

        // ajax请求

        $.ajax({

            url: "/get_ajax/",

            type: 'GET',

            data: JSON.stringify({

                name: $(":text").val(),

                pwd: $(":password").val()

            }),

            contentType:"application/json",

            success: function (data) {

                console.log(data);

                var data=JSON.parse(data);

                if(!data){

                    $(".login_error").html('用户名或密码错误');

                }

            }

        })

    })

</script>

</body>

</html>

3. 视图函数

import json

from django.shortcuts import render,redirect,HttpResponse

# Create your views here.

def index(request):

    return render(request,'index.html')

def get_OK(request):

    return render(request,'get_OK.html')

def get_ajax(request):

    username=request.GET.get('name')

    password=request.GET.get('pwd')

    flag=False

    if username=="yuan" and password =='123':

        flag =True

    return HttpResponse(json.dumps(flag))

3.  参数说明：

######################------------data---------################

       data: 当前ajax请求要携带的数据，是一个json的object对象，ajax方法就会默认地把它编码成某种格式

             (urlencoded:?a=1&b=2)发送给服务端；此外，ajax默认以get方式发送请求。

             function testData() {

               $.ajax("/test",{     //此时的data是一个json形式的对象

                  data:{

                    a:1,

                    b:2

                  }

               });                   //?a=1&b=2

######################------------processData---------################

processData：声明当前的data数据是否进行转码或预处理，默认为true，即预处理；if为false，

             那么对data：{a:1,b:2}会调用json对象的toString()方法，即{a:1,b:2}.toString()

             ,最后得到一个［object，Object］形式的结果。

######################------------contentType---------################

contentType：默认值: "application/x-www-form-urlencoded"。发送信息至服务器时内容编码类型。

             用来指明当前请求的数据编码格式；urlencoded:?a=1&b=2；如果想以其他方式提交数据，

             比如contentType:"application/json"，即向服务器发送一个json字符串：

               $.ajax("/ajax_get",{

                  data:JSON.stringify({

                       a:22,

                       b:33

                   }),

                   contentType:"application/json",

                   type:"POST",

               });                          //{a: 22, b: 33}

             注意：contentType:"application/json"一旦设定，data必须是json字符串，不能是json对象

######################------------traditional---------################

traditional：一般是我们的data数据有数组时会用到 ：data:{a:22,b:33,c:["x","y"]},

              traditional为false会对数据进行深层次迭代；

待续.. ...　　

　　

　　

　

Django Ajax学习一的更多相关文章

  1. Django Ajax学习二之文件上传

    基于Django实现文件上传 1. url路由配置 路径:C:\Users\supery\Desktop\day82\demo_ajax\demo_ajax\urls.py from django.c ...

  2. Django Ajax学习二之csrf跨站请求伪造

    方式1 $.ajaxSetup({ data: {csrfmiddlewaretoken: '{{ csrf_token }}' }, }); 方式2 # html文件from表单中<form& ...

  3. python学习-- Django Ajax CSRF 认证

    使用 jQuery 的 ajax 或者 post 之前 加入这个 js 代码:http://www.ziqiangxuetang.com/media/django/csrf.js /*======== ...

  4. 关于Django Ajax CSRF 认证

    CSRF(Cross-site request forgery跨站请求伪造,也被称为“one click attack”或者session riding,通常缩写为CSRF或者XSRF,是一种对网站的 ...

  5. Django：学习笔记(8)——文件上传

    Django:学习笔记(8)——文件上传 文件上传前端处理 本模块使用到的前端Ajax库为Axio,其地址为GitHub官网. 关于文件上传 上传文件就是把客户端的文件发送给服务器端. 在常见情况(不 ...

  6. Django中间件、csrf跨站请求、csrf装饰器、基于django中间件学习编程思想

    django中间件 中间件介绍 什么是中间件? 官方的说法:中间件是一个用来处理Django的请求和响应的框架级别的钩子.它是一个轻量.低级别的插件系统,用于在全局范围内改变Django的输入和输出. ...

  7. Ajax学习心得

    Ajax学习心得 大致学了下Ajax,才知道它不是某种编程语言,而是一种在无需加载整个页面的情况下能够更新部分网页的技术.了解了它的功能后觉得这真是一种好的技术,这得给前端和运维省多少力啊! 传统的网 ...

  8. Django快速学习搭建blog项目

    新手学习Django,本文学习的文档是<Django Web开发指南>.好了我也是新手,没什么好说了,go!- 首先先确定环境,我是在linux(Ubuntu14.04 gnome)下. ...

  9. AJax 学习笔记二(onreadystatechange的作用)

    AJax 学习笔记二(onreadystatechange的作用) 当发送一个请求后,客户端无法确定什么时候会完成这个请求,所以需要用事件机制来捕获请求的状态XMLHttpRequest对象提供了on ...

随机推荐

  1. 项目管理---git----快速使用git笔记(二)------git的本地安装

    下载安装包 在使用Git前我们需要先安装 Git.Git 目前支持 Linux/Unix.Solaris.Mac和 Windows 平台上运行. Git 各平台安装包下载地址为:http://git- ...

  2. de4dot 用法

    使用de4dot反混淆一下 用法 de4dot -f input.dll -o output.dll

  3. idea导入web项目tomcat

    概述 主要分为项目配置和tomcat配置两大步骤. 一.项目配置 打开idea,选择导入项 选择将要打开的项目路径后,继续选择项目的原本类型(后续引导设置会根据原本的项目类型更新成idea的项目),此 ...

  4. 面向小数据集构建图像分类模型Keras

    文章信息 本文地址:http://blog.keras.io/building-powerful-image-classification-models-using-very-little-data. ...

  5. Android 解决adb server is out of date. killing... ADB server didn't ACK * failed to star

    The connection to adb is down, and a severe error has occured. [-- :: - HelloOPone] You must restart ...

  6. Java中String的hash函数分析

    转载自:http://blog.csdn.net/hengyunabc/article/details/7198533 JDK6的源码: [java] view plaincopy /** * Ret ...

  7. 关于mysql 删除数据后物理空间未释放

    转载自:http://www.cnblogs.com/shawnloong/archive/2013/02/07/2908911.html OPTIMIZE TABLE 当您的库中删除了大量的数据后, ...

  8. 【Luogu】P3933 Chtholly Nota Seniorious

    [题意]将n*m矩阵分成两个区域,要求满足一定条件,求两区域内部极差较大值最小.n,m<=2000 [算法]二分 [题解]极差的数值满足单调性,所以考虑二分极差. 对于给定的极差,将所有数值排序 ...

  9. Drainage Ditches（POJ1273+网络流+Dinic+EK）

    题目链接:poj.org/problem?id=1273 题目: 题意:求最大流. 思路:测板子题,分别用Dinic和EK实现(我的板子跑得时间均为0ms). Dinic代码实现如下: #includ ...

  10. hdu 1241Oil Deposits(BFS)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1241 Oil Deposits Time Limit: 2000/1000 MS (Java/Othe ...