Django Ajax的使用教程

 更新时间:2017年06月05日 09:26:30   作者:浅雨凉  
这篇文章主要介绍了Django Ajax的使用教程,需要的朋友可以参考下

简介:

AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。

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

AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下。

Ajax

  很多时候,我们在网页上请求操作时,不需要刷新页面。实现这种功能的技术就要Ajax!

jQuery中的ajax就可以实现不刷新页面就能向后台请求或提交数据的功能,现用它来做django中的ajax,所以先把jquey下载下来,版本越高越好。

一、ajax发送简单数据类型:

html代码:在这里我们仅发送一个简单的字符串

views.py

 #coding:utf8
 from django.shortcuts import render,HttpResponse,render_to_response
 def Ajax(request):
   if request.method=='POST':
     print request.POST
     return HttpResponse('执行成功')
   else:
     return render_to_response('app03/ajax.html')

ajax.html

<!DOCTYPE html>
 <html>
 <head>
 <meta charset="UTF-8">
 <title>Ajax</title>
 </head>
 <body>
   <input id='name' type='text' />
   <input type='button' value='点击执行Ajax请求' onclick='DoAjax()' />
   <script src='/static/jquery/jquery-3.2.1.js'></script>
   <script type='text/javascript'>
   function DoAjax(){
     var temp = $('#name').val();
     $.ajax({
       url:'app03/ajax/',
       type:'POST',
       data:{data:temp},
       success:function(arg){
         console.log(arg);
       },
       error:function(){
         console.log('failed')
       }
     });
   }
   </script>
 </html>

运行,结果:

二、ajax发送复杂的数据类型:

html代码:在这里仅发送一个列表中包含字典数据类型

由于发送的数据类型为列表 字典的格式,我们提前要把它们转换成字符串形式,否则后台程序接收到的数据格式不是我们想要的类型,所以在ajax传输数据时需要JSON

<!DOCTYPE html>
 <html>
 <head>
 <meta charset="UTF-">
 <title>Ajax</title>
 </head>
 <body>
   <input id='name' type='text' />
   <input type='button' value='点击执行Ajax请求' onclick='DoAjax()' />
   <script src='/static/jquery/jquery-3.2.1.js'></script>
   <script type='text/javascript'>
   function DoAjax(){
     var temp = $('#name').val();
     $.ajax({
       url:'app03/ajax/',
       type:'POST',
       data:{data:temp},
       success:function(arg){
         var obj=jQuery.parseJSON(arg);
         console.log(obj.status);
         console.log(obj.msg);
         console.log(obj.data);
         $('#name').val(obj.msg);
       },
       error:function(){
         console.log('failed')
       }
     });
   }
   </script>
 </html>

views.py

 #coding:utf
 from django.shortcuts import render,HttpResponse,render_to_response
 import json
 # Create your views here.
 def Ajax(request):
   if request.method=='POST':
     print request.POST
     data = {'status':,'msg':'请求成功','data':['','','']}
     return HttpResponse(json.dumps(data))
   else:
     return render_to_response('app/ajax.html')

打印数据样式:

以上所述是小编给大家介绍的Django Ajax的使用教程,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

相关文章

  • ajax传递一个参数具体实现

    ajax传递一个参数具体实现

    ajax传递一个参数或多个参数在使用过程中由于特殊需求经常会用到,下面与大家分享下具体的实现方法,感兴趣的朋友可以参考下哈
    2013-05-05
  • 利用ajax传递数组及后台接收的方法详解

    利用ajax传递数组及后台接收的方法详解

    这篇文章主要给大家介绍了关于利用ajax传递数组及后台接收的相关资料,文中介绍的非常详细,对大家具有一定的参考学习价值,需要的朋友们下面跟着小编一起来学习学习吧。
    2017-06-06
  • 各种AJAX方法的使用比较详解

    各种AJAX方法的使用比较详解

    AJAX技术经过这么多年的发展,出现了一些框架或类库用于简化开发工作,不同的框架类库的使用方法也各不相同。 现在,再回头看看这些技术,看看这些框架类库,我们能感受到技术在不断地发展,AJAX开发越来越容易了。
    2015-09-09
  • Ajax 入门之 GET 与 POST 的不同处详解

    Ajax 入门之 GET 与 POST 的不同处详解

    这篇文章主要介绍了Ajax 入门之 GET 与 POST 的不同处详解,需要的朋友可以参考下
    2017-02-02
  • Ajax的小贴士使用小结

    Ajax的小贴士使用小结

    Ajax的小贴士使用小结...
    2007-10-10
  • jsp+ajax实现无刷新上传文件的方法

    jsp+ajax实现无刷新上传文件的方法

    这篇文章主要介绍了jsp+ajax实现无刷新上传文件的方法,结合实例形式分析了ajax无刷新上传文件及jsp后台处理的相关技巧,需要的朋友可以参考下
    2016-01-01
  • Ajax传递中文参数到后台乱码的有效解决方法

    Ajax传递中文参数到后台乱码的有效解决方法

    使用Ajax传递中文参数,如果不对参数进行处理的话,传到后台会变成乱码,解决方法很简单,需要的朋友可以参考下本文
    2014-05-05
  • Ajax登陆使用Spring Security缓存跳转到登陆前的链接

    Ajax登陆使用Spring Security缓存跳转到登陆前的链接

    这篇文章主要介绍了Ajax登陆使用Spring Security缓存跳转到登陆前的链接,需要的朋友可以参考下
    2019-04-04
  • 解决AJAX返回状态200没有调用success的问题

    解决AJAX返回状态200没有调用success的问题

    今天小编就为大家分享一篇解决AJAX返回状态200没有调用success的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-08-08
  • AJAX的跨域问题解决方案

    AJAX的跨域问题解决方案

    跨域简单的说,就是从一个域名的网页去访问另一个域名网页的资源,下面这篇文章主要给大家介绍了关于AJAX的跨域问题解决的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2022-12-12

最新评论