Ajax:页面不做刷新,直接将数据悄悄提交到后台,然后通过回调函数处理返回结果。

$.Ajax({          # 提交到后台
url:'/host', # 提交到哪里
type:'POST' # 提交方式
data:{'k1':123,'k2':'root'} # 提交数据
   # 如果data中包含的不是字符串,是个列表,那么写法要使用:traditional:true 可以将列表传入后台
data:$('#add_form').serialize(), #代替上一句,将form表单里所有数据统一打包发到后台
# 注意如果data字典中还包含1个字典,这个包含的字典需要转为字符串才可以发送:JSON.stringfy({'k1','v1'})
dataType:'JSON', # 这里是jquery功能,将传回来的数据进行json解析,就不需要下面的函数再次进行解析了,下面函数中的参数就为obj对象
traditional:true, # 可以将data中的列表数据传到后台,python使用get_list来接收列表数据。
success: function(data){ # 回调函数,等待接收上面提交后的返回数据
// data是服务器端返回的字符串
var obj = JSON.parse(data);
}
error:function(){ #当前台发送了一个请求到后台,后台未捕捉到发了个未知的错误,才触发这里执行
}
})
建议:永远让服务端返回一个字典,返回方式:return HttpResponse(json.dumps(字典))
不要使用render,因为返回的模板文件只做渲染,无法json转换,不支持redirect方法。 以下这些方法全部是调用上面的Ajax方法,不同的是只修改对应的type方法,所以说只用Ajax方法即可。
$.get(url='XX',data:{},success)
$.post

前端学习之- Ajax的更多相关文章

  1. 前端学习——使用Ajax方式POST JSON数据包

    0.前言     本文解释怎样使用Jquery中的ajax方法传递JSON数据包,传递的方法使用POST(当然PUT又有时也是一个不错的选择).POST JSON数据包相比标准的POST格式可读性更好 ...

  2. 前端学习——JQuery Ajax使用经验

    0.前言     在项目推进过程中常常使用Ajax,通过Jquery提供的函数能够很方便的使用Ajax,可是在实际使用中也遇到一些问题,比如怎样防止浏览器使用缓存,怎样使用同步方式等.通过博文整理总结 ...

  3. web前端学习部落22群开源分享 左边菜单导航

    有大量web前端开发工具及学习资料,可以搜群[ web前端学习部落22群 ]进行下载,遇到学习问题也可以问群内专家以及课程老师哟 <!DOCTYPE html> <html lang ...

  4. 【FE前端学习】第二阶段任务-基础

    技能学习部分: 1.需要熟练掌握HTML标签以及CSS各个常用属性. 2.掌握CSS3 常用属性 3.掌握jquery的基本用法,对于JS基本逻辑语句需要熟练掌握 上文 [FE前端学习]第二阶段任务- ...

  5. jQuery延迟加载(懒加载)插件 – jquery.lazyload.js-Web前端(W3Cways.com) - Web前端学习之路

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

  6. web前端学习就这9个阶段,你属于哪个阶段?

    第一阶段:HTML+CSS: HTML进阶.CSS进阶.div+css布局.HTML+css整站开发. JavaScript基础:Js基础教程.js内置对象常用方法.常见DOM树操作大全.ECMAsc ...

  7. 前端学习日记之HTML、CSS 简单总结

    前端学习日记之HTML.CSS 简单总结 标签(空格分隔): html css 前端学习日记 html超文本标记语言 一. h标题标签 h1-h7 <!DOCTYPE html> < ...

  8. web前端学习路线(含20个真实web开发项目集合)

    目前web前端工程师日均岗位缺口已经超过50000,随着互联网+的深入发展,html5作为前端展示技术,市场人才需求量将呈直线上涨. Web前端工程师的岗位职责是利用HTML.CSS.Java.DOM ...

  9. 前端通信:ajax设计方案(三)--- 集成ajax上传技术

    在此之前让我感慨一下现在的前端开发的氛围.我遇到好多人,给我的观念都是,这个东西这个框架有了,那个东西那个框架做了,前端嘛,学几个框架,这个拼凑一下那个拼凑一下就好了.其实我想问,东西都框架做了,那你 ...

随机推荐

  1. 自定义 TypeHandler

    自定义TypeHandler分为三个步骤: 1.编写自定义TypeHandler,并继承自抽象类BaseTypeHandler<T>,实现抽象方法 2.在mybatis-config.xm ...

  2. 实现流水灯以间隔500ms的时间闪烁(系统定时器SysTick实现的精确延时)

    /** ****************************************************************************** * @file main.c * ...

  3. ubuntu服务器切换语言

    如果在安装Ubuntu Server时选择了中文,在系统安装完毕后,默认是中文,在操作时经常会显示乱码,如果需要设置回英文,则修改/etc/default/locale,将 LANG="cn ...

  4. WEB前端JS与UI框架

    前端Js框架汇总 概述: 有些日子没有正襟危坐写博客了,互联网飞速发展的时代,技术更新迭代的速度也在加快.看着Java.Js.Swift在各领域心花路放,也是煞是羡慕.寻了寻.net的消息,也是振奋人 ...

  5. 使用Recast.AI创建具有人工智能的聊天机器人

    很多SAP顾问朋友们对于人工智能/机器学习这个话题非常感兴趣,也在不断思考如何将这种新技术和SAP传统产品相结合.Jerry之前的微信公众号文章C4C和微信集成系列教程曾经介绍了Partner如何利用 ...

  6. mysql 增删查改

    非关系型数据库关系型数据库Oracle mysql sqlserver db2 Postgresql Sqlite access sqlserver 微软db2 ibm================ ...

  7. hasChildNodes()方法,nodeName、nodeValue、nodeType介绍

    Document对象的使用:hasChildNodes()方法,nodeName.nodeValue.nodeType的简单介绍 一.hasChildNodes() 说明: (1)       该方法 ...

  8. 通过java反射机制,获取对象的属性和值(包括所有继承的父类)

    java的反射机制提供了两种方法: getDeclaredFields() :该方法能获取到本类的所有属性,包括private,protected和public,但不能获取到继承的父类的属性. get ...

  9. TWaver可视化编辑器的前世今生(一)电信网管编辑器

    走到今天,TWaver,一个致力于在技术领域(Technology)的弄潮儿(Waver),已经是第十二个年头.当年网吧的小网管都是IDC机房的运维人员了,TWaver也见证了这个时代的成长变迁. 萌 ...

  10. 服务器编程心得(四)—— 如何将socket设置为非阻塞模式

    1. windows平台上无论利用socket()函数还是WSASocket()函数创建的socket都是阻塞模式的: SOCKET WSAAPI socket( _In_ int af, _In_ ...