send_Ajax

import json,time
 
def index(request):
 
 return render(request,"index.html")
 
def handle_Ajax(request):
 
 username=request.POST.get("username")
 password=request.POST.get("password")
 
 print(username,password)
 time.sleep(10)
 
 return HttpResponse(json.dumps("Error Data!"))

######################------------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对象

    views.py: json.loads(request.body.decode("utf8"))


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

traditional：一般是我们的data数据有数组时会用到 ：data:{a:22,b:33,c:["x","y"]},
    traditional为false会对数据进行深层次迭代；

/*

dataType： 预期服务器返回的数据类型,服务器端返回的数据会根据这个值解析后，传递给回调函数。
   默认不需要显性指定这个属性，ajax会根据服务器返回的content Type来进行转换；
   比如我们的服务器响应的content Type为json格式，这时ajax方法就会对响应的内容
   进行一个json格式的转换，if转换成功，我们在success的回调函数里就会得到一个json格式
   的对象；转换失败就会触发error这个回调函数。如果我们明确地指定目标类型，就可以使用
   data Type。
   dataType的可用值：html｜xml｜json｜text｜script
   见下dataType实例

*/

 
 
 
 


计算两个数的和，测试ajax
+=
sendajax

def index(request):
 return render(request,"index.html")

def sendAjax(request):
 print(request.POST)
 print(request.GET)
 print(request.body) 
 num1 = request.POST.get("num1")
 num2 = request.POST.get("num2")
 ret = float(num1)+float(num2)
 return HttpResponse(ret)

def sendAjax(request):
 import json
 print(request.POST) #
 print(request.GET) #
 print(request.body) #b'{"num1":"2","num2":"2"}' 注意这时的数据不再POST和GET里，而在body中
 print(type(request.body.decode("utf8"))) # 
 # 所以取值的时候得去body中取值，首先得反序列化一下
 data = request.body.decode("utf8")
 data = json.loads(data)
 num1= data.get("num1")
 num2 =data.get("num2")
 ret = float(num1)+float(num2)
 return HttpResponse(ret)

function createXMLHttpRequest() {
    var xmlHttp;
    // 适用于大多数浏览器，以及IE7和IE更高版本
    try{
      xmlHttp = new XMLHttpRequest();
    } catch (e) {
      // 适用于IE6
      try {
        xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
      } catch (e) {
        // 适用于IE5.5，以及IE更早版本
        try{
          xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e){}
      }
    }      
    return xmlHttp;
  }

xmlHttp.onreadystatechange = function() {
      alert('hello');
    };

xmlHttp.onreadystatechange = function() {
      if(xmlHttp.readyState == 4) {
        alert('hello');  
      }
    };

xmlHttp.onreadystatechange = function() {
      if(xmlHttp.readyState == 4 && xmlHttp.status == 200) {
        alert(xmlHttp.responseText);  
      }
    };

基于JS的ajax没有Content-Type这个参数了，也就不会默认是urlencode这种形式了，需要我们自己去设置
<1>需要设置请求头：xmlHttp.setRequestHeader(“Content-Type”, “application/x-www-form-urlencoded”)；
注意 :form表单会默认这个键值对不设定，Web服务器会忽略请求体的内容。

<2>在发送时可以指定请求体了：xmlHttp.send(“username=yuan&password=123”)

基于jQuery的ajax和form发送的请求，都会默认有Content-Type，默认urlencode，

Content-Type:客户端告诉服务端我这次发送的数据是什么形式的
dataType:客户端期望服务端给我返回我设定的格式

 xmlhttp.open("get","/sendAjax/?a=1&b=2");

def sendAjax(request):
  num1=request.POST.get("num1")
  num2 = request.POST.get("num2")
  ret = float(num1)+float(num2)
  return HttpResponse(ret)

创建XMLHttpRequest对象；
  调用open()方法打开与服务器的连接；
  调用send()方法发送请求；
  为XMLHttpRequest对象指定onreadystatechange事件函数，这个函数会在

  XMLHttpRequest的1、2、3、4，四种状态时被调用；

  XMLHttpRequest对象的5种状态，通常我们只关心4状态。

  XMLHttpRequest对象的status属性表示服务器状态码，它只有在readyState为4时才能获取到。

  XMLHttpRequest对象的responseText属性表示服务器响应内容，它只有在
  readyState为4时才能获取到！

- 如果"Content-Type"="application/json"，发送的数据是对象形式的{},需要在body里面取数据，然后反序列化
= 如果"Content-Type"="application/x-www-form-urlencoded"，发送的是/index/?name=haiyan&agee=20这样的数据，
 如果是POST请求需要在POST里取数据，如果是GET，在GET里面取数据

//--------------------------------------------------index.html

注册

用户名：

密 码：





//--------------------------------------------------views.py
from django.views.decorators.csrf import csrf_exempt

def login(request):
  print('hello ajax')
  return render(request,'index.html')
  # return HttpResponse('helloyuanhao')

@csrf_exempt
def ajax_check(request):
  print('ok')

  username=request.POST.get('username',None)
  if username=='yuan':
    return HttpResponse('true')
  return HttpResponse('false')

项目一
jsonp

=========================index.html===============
项目二
jsonp



=========================views===============

from django.shortcuts import render,HttpResponse

# Create your views here.
def index(request):
  return render(request, "index.html")
def ajax_send2(request):
  print(222222)
  return HttpResponse("hello")

项目一
jsonp

def ajax_send2(request):
  import json
  print(222222)
  # return HttpResponse("func('name')")
  s = {"name":"haiyan","age":12}
  # return HttpResponse("func('name')")
  return HttpResponse("func('%s')"%json.dumps(s))  #返回一个func()字符串，正好自己的ajax里面有个func函数，就去执行func函数了，
                                arg就是传的形参

===========================jQuery实现=====================
{#  创建一个script标签，让他请求一次，请求完了删除他#}
  //动态生成一个script标签,直接可以定义个函数，放在函数里面
  function add_script(url) {
    var ele_script = $("



==================js实现==========================
sendAjax

function f(){
     addScriptTag("http://127.0.0.1:7766/SendAjax/?callbacks=func")
  }

def SendAjax(request):
 
  import json
 
  dic={"k1":"v1"}
 
  print("callbacks:",request.GET.get("callbacks"))  
  callbacks=request.GET.get("callbacks")  #注意要在服务端得到回调函数名的名字
 
  return HttpResponse("%s('%s')"%(callbacks,json.dumps(dic)))

sendAjax

// 跨域请求实例
  $(".jiangxiTV").click(function () {

    $.ajax({
      url:"http://www.jxntv.cn/data/jmd-jxtv2.html?callback=list&_=1454376870403",
       dataType: 'jsonp',
       jsonp: 'callback',
       jsonpCallback: 'list',
       success:function (data) {
         console.log(data.data);  // [{},{},{},{},{},{}]
         week_list=data.data;
         
         $.each(week_list,function (i,j) {
           console.log(i,j); // 1 {week: "周一", list: Array(19)}
           s="
"+j.week+"列表
";
           $(".show_list").append(s);

           $.each(j.list,function (k,v) { // {time: "0030", name: "通宵剧场六集连播", link: "http://www.jxntv.cn/live/jxtv2.shtml"}
             a="
"+v.name+"
";
             $(".show_list").append(a);
           })
         })
         
       }
    })


  })