注意ajax 必须放在script脚本中使用

ajax用于前端朝后端提交数据,并且后端函数处理好结果返回给success函数作为回调函数给前端,前端拿到后端传来的值,比如code==0 来做相应的前端渲染

Ajax
局部刷新
异步提交
ajax提交数据基本写法
$('#b1').click(function(){
$.ajax({
url:'', # 不写默认朝当前路径提交
type:'post', # 提交数据的方式
data:{'name':'jason'},
success:function(data){
console.log(data)
}
})
})

前端提交数据的编码方式------------->contentType
urlencoded name=jason&pwd=123&xxx=xxx
formdata 文件格式
application/json {"name":"jason"}
注意:在写web相关的项目的时候,一定要指定你提交的数据到底是什么编码格式
你在提交数据的时候,不能骗后端

ajax提交提交json格式数据
$('#b1').click(function(){
$.ajax({
url:'', # 不写默认朝当前路径提交
type:'post', # 提交数据的方式
data:JSON.stringify({'name':'jason'}),
contentType:'application/json'
success:function(data){
console.log(data)
}
})
})

ajax上传文件
1.上传文件需要使用内置对象FormData
$("#btn").click(function () {
//上传文件,必须用FormData,生产一个formdata对象
var formdata=new FormData();
formdata.append('name',$("#name").val()); # 也支持传键值对的数据
//取出文件$("#myfile")[0].files拿到的是文件列表,取第0个把具体的文件取出来
formdata.append('myfile',$("#myfile")[0].files[0]);
$.ajax({
url:'/index/',
type:'post',
//不预处理数据,(name=lqz&age=18)
processData:false,
//指定往后台传数据的编码格式(urlencoded,formdata,json)
//现在用formdata对象处理了,就不需要指定编码格式了,不要给我编码了
contentType:false,
data:formdata,
success:function (data) {
alert(data)
}
})

ajax 实战使用的更多相关文章

  1. JQuery+Ajax实战三级下拉列表联动(八)

    本片文章为练习,项目中不会这样写: 一:涉及到的知识点: jQuery Dom操作 jQuery Ajax操作 ASP.net中的json操作 二:用了自动代码生成器 1.Dal层的代码: publi ...

  2. Ajax 实战(一)

    目录 Ajax 实战(一) 简介 入门案例 基于Ajax进行登录验证 HTTP请求编码格式和报文 Content-Type=application/x-www-form-urlencoded Cont ...

  3. Ajax实战(原生)

    /** 之前一直在学习ajax,也拿jQuery写了很多,感觉还是写原生的对基础的理论理解的深刻.特此书写. * 得到ajax对象 */ function getajaxHttp() { var xm ...

  4. AJAX 实战【三级联动】分析

    使用 AJAX 对全国地名进行选取 <%@ Page Language="C#" AutoEventWireup="true" CodeFile=&quo ...

  5. ajax实战用法详解

    谦虚使人进步,总结使人提高! 以下5个方法执行一般Ajax请求的简短形式,在处理复杂的Ajax请求时应该使用jQuery.ajax() 1.load(url,[data],[callback])载入远 ...

  6. node+ajax实战案例(6)

    8.删除客户 8.1.发送id到后台 删除用户信息比较简单,只需要把对应行的id发送到后台就可以了 oTable.onclick = function (ev) { var ev = ev || ev ...

  7. node+ajax实战案例(5)

    6.添加客户 6.1.点击添加按钮,弹出表单框 // 添加用户 显示对话框 var addBtn = document.getElementById('add-btn'); var addUser = ...

  8. node+ajax实战案例(4)

    4.用户登录实现 4.1.用户登录实现思路 1 用户输入登录信息,点击登录的时候把用户登录的这些信息收集起来,然后组装数据通过ajax方式发送到后台 2 后台接到用户输入的登录信息,把这些信息拿去和数 ...

  9. node+ajax实战案例(3)

    3.用户注册实现 3.1.注册用户功能的实现逻辑 1 用户在表单上输入注册信息 2 点击注册后,收集用户在表单上输入的注册信息并且发送给后台 3 后台接收用户发送过来的注册信息 4 后台需要处理数据并 ...

随机推荐

  1. oracle-字符串常用函数

    1.拼接字符串 1)可以使用“||”来拼接字符串 -------------------------------------- select '拼接'||'字符串' as str from dual ...

  2. tp3.2控制器返回时关闭子窗口刷新父页面

    我的项目操作都是在子页面弹窗中执行,当我操作成功或失败时,都要关闭当前子窗口,刷新父页面: $this->assign('jumpUrl',"javascript:window.par ...

  3. win7 SP1 64位 原版 百度网盘下载

    下载地址:https://pan.baidu.com/s/1bnOtKU5YH4gSr1RmZR2BkQ 提取码 :s9o7 扫码下载:

  4. Least Common Ancestors

    /* Least Common Ancestors * Au: Small_Ash */ #include <bits/stdc++.h> using namespace std; con ...

  5. [CSP-S模拟测试]:队长快跑(DP+离散化+线段树)

    题目背景 传说中,在远古时代,巨龙大$Y$将$P$国的镇国之宝窃走并藏在了其巢穴中,这吸引着整个$P$国的所有冒险家前去夺回,尤其是皇家卫士队的队长小$W$.在$P$国量子科技实验室的帮助下,队长小$ ...

  6. Java学习之构造函数

    构造函数特点:  函数名和类名相同  没有返回值(不用定义返回值类型)作用:  对象初始化注意:  如果类没有定义构造函数时,系统会默认定义一个无参的构造函数  如果定义了构造函数,系统不会定义构造函 ...

  7. excel数据生成sql insert语句

    excel数据生成sql insert语句 excel表格中有A.B.C三列数据,希望导入到数据库users表中,对应的字段分别是name,sex,age . 在你的excel表格中增加一列,利用ex ...

  8. 1.0搭建 Node.js 开发环境

    <搭建 Node.js 开发环境> 本课程假设大家都是在 Linux 或者 Mac 下面.至于使用 Windows 并坚持玩新技术的同学,我坚信他们一定有着过人的.甚至是不可告人的兼容性 ...

  9. appium 环境搭建(不推荐安装此版本appium,推荐安装appium desktop)

    一:安装node.js 1.双击这个软件 2.一键安装,全都下一步,不要私自更改安装路径 3.打开cmd,输入npm,出现如下截图表示成功 二:安装appium 1.双击appium-installe ...

  10. git for windows 2.1版本git bash下git log乱码修复

    git bash,输入以下命令git config --global i18n.logoutputencoding utf-8git config quotepath false关闭git bash, ...