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. EJB 使用多个数据源问题

    编辑 删除 如果在JBoss中同时使用俩个数据源就会发生如下异常: Transaction is not active: tx=TransactionImple < ac, BasicActio ...

  2. SQLite – GROUP BY

    SQLite - GROUP BY SQLite GROUP BY子句中使用与SELECT语句的合作安排相同的数据组. 在GROUP BY子句之前一个SELECT语句的WHERE子句,先于ORDER ...

  3. emacs - GNU Emacs

    总览 (SYNOPSIS) emacs [ command-line switches ] [ files ... ] 描述 (DESCRIPTION) GNU Emacs 是 Emacs 的 一个 ...

  4. 【整理】用JSON-server模拟REST API

    用JSON-server模拟REST API https://www.cnblogs.com/ys-wuhan/p/6387791.html

  5. tabsGif

    tabsGif

  6. QT+模态对话框与非模态对话框

    #include "mainwindow.h" #include <QMenuBar> #include <QMenu> #include <QAct ...

  7. DI:Defect Index(缺陷率)

    DI:Defect Index(缺陷率) 定义:DI值是衡量软件质量的高低的指标之一. 公式:DI= 致命级别的问题个数*10+严重级别的问题个数*3+一般级别的问题个数*1+提示级别的问题个数*0. ...

  8. SQL Server查看表的约束

    sysobjects是系统自建的表,里面存储了在数据库内创建的每个对象,包括约束.默认值.日志.规则.存储过程等. SELECT * FROM sysobjects WHERE OBJECT_NAME ...

  9. 5.1 qbxt 一测 T2

    求和[问题描述] 组合数 C(n,m)是从 n 个物品中取 m 个的方案数. C(n,m)=(n!)/(m!(n-m)!) 斐波那契数列 F 满足,F[0]=F[1]=1,n≥2 时 F[n]=F[n ...

  10. 操作系统复习——如何查看一个进程的详细信息,如何追踪一个进程的执行过程 ,如何在 Linux 系统下查看 CPU、内存、磁盘、IO、网卡情况?epoll和select区别?

    1. 如何查看一个进程的详细信息,如何追踪一个进程的执行过程 通过pstree命令(根据pid)进行查询进程内部当前运行了多少线程:# pstree -p 19135(进程号) 使用top命令查看(可 ...