zoukankan      html  css  js  c++  java
  • django框架之Ajax提交数据等相关内容-71

    1 ajax介绍

    # 1 异步 Javascript 和 XML:
    -异步:跟同步是对应的  
       -javascript:通过javascript来操作,发送请求 ,到服务端
       -xml:数据交互使用xml,现在主流使用json格式
       -xml:可阅读性比较高,解析复杂,占的空间大
           <name>lqz</name>
           <age>19</age>
       -json:可阅读性比较高,解析简单,占的空间小
      {"name":"lqz","age":19}
    -浏览器页面局部刷新(js的dom操作)
       
       -通过js发送http的请求(go,java,php,requset)
       
    # 2 同步和异步

    #3 IAAS,PAAS,SAAS

    # 4 同步交互和异步交互
       同步交互:客户端发出一个请求后,需要等待服务器响应结束后,才能发出第二个请求;
       异步交互:客户端发出一个请求后,无需等待服务器响应结束,就可以发出第二个请求。

    2 ajax的简单使用

    1 原生js写ajax请求(写起来很复杂,而且需要考虑浏览器版本)
    2 jquery帮咱们封装好了一个方法 ajax,我们直接调用jquery的方法,就可以发送ajax的请求
    3 后期,前后端分离了,还可以继续使用jquery的ajax, axios更主流一些
    4 现在我们学的jquery的ajax方法的使用


    5 需求:通过Ajax,实现前端输入两个数字,服务器做加法,返回到前端页面

    6 模板
       $.ajax({
           url: '/add/',  
           method: 'post',
           data:{'a':$("#first").val() ,'b':$("#second").val() },
           success:function (data) {
               //成功触发
          },
           error:function (error) {
               //失败,触发
          }
      })
       
       
       # 默认清空下ajax会把{'a':$("#first").val() ,'b':$("#second").val() }数据转成
       # 预处理数据
       a=20&b=30,放到body体中
       # 编码默认用urlencoded

    3 ajax上传文件

    1 http请求,body体中放文件内容,ajax本质就是发送http请求,所以它可以上传文件
    2 两种上传文件的方式,form表单,ajax

    3 固定模板
       var formdata=new FormData()
       formdata.append('myfile',$("#id_file")[0].files[0])
       # 还可以带数据
       $.ajax({
               url:'/uploadfile/',
               method: 'post',
               //上传文件必须写这两句话
               processData:false,  # 预处理数据,
               contentType:false,  # 不指定编码,如果不写contentType,默认用urlencoded
               data:formdata,      # formdata内部指定了编码,并且自行处理数据
               success:function (data) {  
                   console.log(data)
              }
          })

    4 ajax提交json格式

    $.ajax({
               url:'/uploajson/',  //写全,是什么样就写什么样
               method:'post',
               contentType: 'application/json',
               //data要是json格式字符串
               //data:'{"name":"","password":""}',
               //把字典转成json格式字符串
               //JSON.stringify(dic)
               //把json格式字符串转成对象
               //JSON.parse(data)
               data:JSON.stringify({name:$("#id_name1").val(),password:$("#id_password1").val()}),
               success:function (data) {
                   //返回字符串类型,需要转成js的对象,字典

                   //1 如果:django 返回的是HttpResponse,data是json格式字符串,需要自行转成字典
                   //2 如果:django 返回的是JsonResponse,data是就是字典
                   //ajax这个方法做的是,如果响应数据是json格式,自动反序列化
                   console.log(typeof data)
                   var res=JSON.parse(data)
                   console.log(typeof res)
                   console.log(res.status)
                   console.log(res.msg)


              }
          })

    5 django内置序列化器(了解,不好用,后面有更好的)

    1 把对象转成json格式,json.dumps实现不了,
    2 django内置了一个东西,可以把对象转成json格式
    from django.core import serializers
    book_list = Book.objects.all()    
    ret = serializers.serialize("json", book_list)  # ret就是json格式字符串


    ll=[]
    for book in book_list:
       ll.append({'name':book.name,'price':book.pirce})  
    import json
    ret=json.dumps(ll)


    return HttpResponse(ret)
  • 相关阅读:
    poj 2325 Persistent Numbers (贪心+高精度)
    迷宫 (BFS)
    poj1087 A Plug for UNIX & poj1459 Power Network (最大流)
    hdu 3549 Flow Problem (最大流)
    CodeForces Round #179 (295A)
    poj 1328 Radar Installation
    HTML 网页游戏 2048
    图论加边算法--链式向前星
    c语言 字符版 简易2048
    POJ 2115 C Looooops(扩展欧几里得)
  • 原文地址:https://www.cnblogs.com/usherwang/p/14119727.html
Copyright © 2011-2022 走看看