一、在ajax请求中,contentType 和 dataType 的区别?

1.contentType    内容类型。
1.1默认是 “application/x-www-form-urlencoded”,这种情况。
contentType :"application/x-www-form-urlencoded; charset=UTF-8", 此时,默认值适合大多数情况,当你明确的传递一个content-type给$.ajax()
那么他必定会发送给服务器。(没有数据也会发送) 1.2 其他可选择的类型:form x-www-form-orlencoded 、raw binary . 2.dataType 数据类型。
预期服务器返回的数据类型。如果不指定,jquery 将自动根据http 包 mime信息来智能判断。
/*
2.1 xml mime的类型就被识别为xml。 2.2 HTML 返回HTML信息,包含的script标签会在插入DOM时候执行。 2.3 script 返回纯文本的JavaScript代码,不会自动缓存结果。
除非设置了,“cache”参数, 2.4 json返回json的数据 dataType: "json", 2.5 jsonp jsonp格式,使用jsonp形式调用函数时候,如“myurl?callback=?”
jquery 将自动替换为正确的函数名,以达到执行回调函数的目的。 */
二、代码示例(用户贷款页面)

        //用form表单将需要获得的数据包起来,设置一个id userData 获取表单中的数据。
<form method="post" action="/loanMoney" id="userData">
<div class="part1">
<div class="item col-xs-12">
<span class="intelligent-label f-fl"><b class="ftx04">*</b>借款金额:</span>
<div class="f-fl item-ifo">
<input type="text" class="txt03 f-r3 required" keycodes="tel" tabindex="2" data-valid="isNonEmpty" data-error="借款金额不能为空" maxlength="10" name="money" id="money">
<span class="ie8 icon-close close hide"></span>
<label class="icon-sucessfill blank hide"></label>
<label class="focus">请填写借款金额</label>
<label class="focus valid"></label>
</div>
</div>
</div>
<div class="part1">
<div class="item col-xs-12">
<span class="intelligent-label f-fl"><b class="ftx04">*</b>借款时间:</span>
<div class="f-fl item-ifo">
<input type="text" class="txt03 f-r3 required" keycodes="tel" tabindex="2" data-valid="isNonEmpty" data-error="借款时间不能为空" maxlength="20" name="loanTime" id="loanTime">
<span class="ie8 icon-close close hide"></span>
<label class="icon-sucessfill blank hide"></label>
<label class="focus">请填写借款时间</label>
<label class="focus valid"></label>
</div>
</div>
</div>
<div class="part1">
<div class="item col-xs-12">
<span class="intelligent-label f-fl"><b class="ftx04">*</b>贷款期数:</span>
<div class="f-fl item-ifo">
<select name="repaymentPeriod" id="repaymentPeriod">
<option value="0">一个月</option>
<option value="1">三个月</option>
<option value="2">六个月</option>
<option value="3">十二个月</option>
<option value="4">二十四个月</option>
</select>
<span class="ie8 icon-close close hide"></span>
<label class="icon-sucessfill blank hide"></label>
<label class="focus">请填写贷款期数</label>
<label class="focus valid"></label>
</div>
</div>
</div>
<div class="part1">
<div class="item col-xs-12">
<span class="intelligent-label f-fl"><b class="ftx04">*</b>还款方式:</span>
<div class="f-fl item-ifo">
<select name="repayType" id="repayType">
<option value="0">先息后本</option>
<option value="1">等额本息</option>
<option value="2">一次性还款</option>
</select>
<span class="ie8 icon-close close hide"></span>
<label class="icon-sucessfill blank hide"></label>
<label class="focus">请填写还款方式</label>
<label class="focus valid"></label>
</div>
</div>
</div>
<div class="part1">
<div class="item col-xs-12">
<span class="intelligent-label f-fl"><b class="ftx04">*</b>收款银行卡号:</span>
<div class="f-fl item-ifo">
<input type="text" class="txt03 f-r3 required" keycodes="tel" tabindex="2" data-valid="isNonEmpty" data-error="银行卡号不能为空" maxlength="20" name="cardNo" id="cardNo">
<span class="ie8 icon-close close hide"></span>
<label class="icon-sucessfill blank hide"></label>
<label class="focus">请填写银行卡号</label>
<label class="focus valid"></label>
</div>
</div>
</div> <div class="part1">
<div class="item col-xs-12">
<span class="intelligent-label f-fl">&nbsp;</span>
<div class="f-fl item-ifo">
<a href="javascript:;" class="btn btn-blue f-r3" id="btn_part1">提交申请</a>
</div>
</div>
</div>
</form> ajax部分 //给提交按钮 增加一个id (btn_part1),添加一个鼠标点击事件。
btn_part1.onclick=function () { //post的提交方式。
$.ajax({
type: "post",
url: "/loanMoney",
//用form表单将需要获得的数据包起来,设置一个id userData
data: $("#userData").serialize(), // 通过表单的方式 (form表单中的input等标签 设置name属性,获取用户输入的贷款数据)获取用户输入的数据。 // data: { // 通过设置id , .val 的方式来获取数据。
// "money": $("#money").val(),
// "loanTime": $("#loanTime").val(),
// "repaymentPeriod": $("#repaymentPeriod").val(),
// "repayType": $("#repayType").val(),
// "cardNo": $("#cardNo").val()
// },
// contentType: "application/json",
contentType :"application/x-www-form-urlencoded; charset=UTF-8",
dataType: "json",
success: function (data) {
if (data.code == "2") {
alert(data.Msg);
} else {
if (confirm("贷款申请成功,是否前往贷款结果页面查看?")) {
window.location.href = "#";
}
}
}
});
}

在ajax请求中,contentType 和 dataType 的区别?的更多相关文章

  1. ajax请求中contentType与dataType区别

    contentType: 告诉服务器,我要发什么类型的数据,默认值: "application/x-www-form-urlencoded". dataType:告诉服务器,我要想 ...

  2. Http请求中 content-type 和 dataType 区别

    contentType: 告诉服务器,我要发什么类型的数据 dataType:告诉服务器,我要想什么类型的数据,如果没有指定,那么会自动推断是返回 XML,还是JSON,还是script,还是Stri ...

  3. Jquery的Ajax中contentType和dataType的区别

    $.ajax({ type: httpMethod, cache:false, async:false, contentType: "application/json; charset=ut ...

  4. Jquery的Ajax中contentType和dataType的区别(转载)

    上代码 $.ajax({ type: httpMethod, cache: false, contentType: "application/json; charset=utf-8" ...

  5. Ajax请求中的Redirect()

    页面中有一个IsLogin()方法,用以判断该请求的触发者是否登录,如果登录了,则执行查询操作,如果没有登录,则Redirect()至登录界面 页面使用了较多的Ajax请求来获取数据,而在Ajax请求 ...

  6. php中AJAX请求中使用post和get请求的区别

    之前使用这两个请求的时候,主要从几个方面考虑: 1.语义,get就是从服务器获取,一般就是获取/查询资源信息.post就是提交给服务器,一般就是更新资源信息. 2.请求文件大小,get一般只有2k这样 ...

  7. Ajax请求中的async:false/true的作用【转载】

    [Ajax请求中的async:false/true的作用] 作者:https://www.cnblogs.com/mmzuo-798/p/7098979.html 前言: 昨天在做倒计时修改的时候,发 ...

  8. Ajax请求中的async:false/true

    Ajax请求中的async:false/trueasync. 默认是 true,即为异步方式,$.ajax执行后,会继续执行ajax后面的脚本,直到服务器端返回数据后,触发$.ajax里的succes ...

  9. jquery Ajax请求中显示Loading...

    jquery Ajax请求中显示Loading... $('#btnTest').click(function(){      $.ajax({           url ---- ,根据你需要设置 ...

随机推荐

  1. 【LeetCode】553. Optimal Division 解题报告(Python & C++)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 日期 题目地址:https://leetcode.c ...

  2. 前端性能和加载体验优化实践(附:PWA、离线包、内存优化、预渲染)

    一.背景:页面为何会卡? 1.1 等待时间长(性能) 项目本身包/第三方脚本比较大. JavaScript 执行阻塞页面加载. 图片体积大且多. 特别是对于首屏资源加载中的白屏时间,用户等待的时间就越 ...

  3. 洛谷 P1434 [SHOI2002]滑雪(DP,记忆化搜索)

    题目描述 Michael喜欢滑雪.这并不奇怪,因为滑雪的确很刺激.可是为了获得速度,滑的区域必须向下倾斜,而且当你滑到坡底,你不得不再次走上坡或者等待升降机来载你.Michael想知道在一个区域中最长 ...

  4. uniapp跳转webview后H5不执行UniAppJSBridgeReady 回调无用

    开始时我在真机上测试使用 <web-view :src="'/hybrid/html/pages/index/index.html?userInfo='+JSON.stringify( ...

  5. [JNI开发]使用javah命令生成.h的头文件

    第一步:进入对应的.java目录 javac xxx.java 生成对应的xxx.class文件 第二步:退回到/java目录 javah -classpath . -jni 包名.类名

  6. LDAP客户端安装

    安装环境: 10.43.159.7 客户端 使用ldap客户端验证登陆: 用户为10.43.159.9服务端上面创建的ldap:zdh1234 1.安装LDAP client认证需要的pam包 yum ...

  7. Swoole 中使用 Lock 实现进程间锁

    注意:不要在 lock 和 unlock 操作中间使用可能引起协程切换的 API. $lock = new Swoole\Lock(SWOOLE_MUTEX); echo "[Master] ...

  8. centos6.5-svn搭建文档

    下载相关软件 wget http://subversion.tigris.org/downloads/subversion-1.6.6.tar.gz wget http://subversion.ti ...

  9. centos6.5-rsync+inotify

    一.目的 通过监控192.168.3.10的目录,实现实时同步. 实验环境 centos1       192.168.3.10 centos2       192.168.3.11 二.配置 cen ...

  10. vue 多级路由嵌套后打开页面是空白

    在多层路由嵌套时,一级子目录必须有一个页面并且添加一具<router-view>,否则路由跳转页面为空,没有任何显示 来自为知笔记(Wiz)