用Ajax提交数据到后台去处理，是非常常用的一种方法，其中用JQuery来写Ajax更是普遍，那么这种简单的基础，就必须要懂了。
提交方式一：手工收集数据，进行传输
来一段实际的代码
var var01 = 123412344;
var var02 = $('input').val();
var var03 = $('div').val();
$.ajax({
url: '/index.php?controller=order&action=deal_func',
//对应后台的处理函数 function deal_func(){ //代码… }
type: 'post',
data:"aaa="+var01+"&bbb="+var02+"&ccc="+var03, //var01、var02、var03 是变量
//如果是确定的数据，就全用引号包起来"aaa=2342"+"&bbb=52554"+"&ccc=23667"
//至于 aaa、bbb、ccc 是自己起的名字，随便什么都好，你喜欢，不过在后台要对应上
success:function(data){
//成功从后台获得返回数据之后的处理
}
})
既然都写到这里，写上后台收集数据的代码或许更容易让人理解
function deal_func(){
$a = IReq::vars('aaa');
$b = IReq::vars('bbb');
$c = IReq::vars('ccc');
//好了，你现在已经在后台获得了传过去的3个数据（$a、$b、$c）了，耍去吧
}
提交方式二：表单序列化
这个就超级好用了，智能序列化数据为你以上手写的形式，返回 “k1=v1&k2=v2...” ，简单方便，不过 只适合于form表单项？（应该是吧。。）
注意：所有的表单项都要有name属性，并且值不要相同
上代码，页面 && 脚本
<body>
<form>
<input type="text" name="aaa">
<input type="checkbox" name="aaa">
<input type="textarea" name="ccc">
<br>
<br>
<input type="button" class="butt" value="button">
</form>
</body>
<script src="jquery-1.11.3.min.js"></script>
<script>
var form_str1 = $('form').serialize();
console.log(form_str1);
$('.butt').click(function(){
var form_str2 = $('form').serialize();
console.log(form_str2);
//序列化后直接用Ajax传输
$.ajax({
url: '/index.php?controller=order&action=deal_func',
type: 'post',
data: form_str2,
dataType:'json',
success:function(data){
//成功从后台获得返回数据之后的处理
}
})
})
</script>
1.什么都不输入
QQ截图20170906160219.png
控制台输出
QQ截图20170906160239.png
2.输入一些内容
QQ截图20170906160627.png
点击button控制台输出
QQ截图20170906160640.png
网友评论