AJax技术

ajax post get方式提交数据详解

字号+ 作者:H5之家 来源:H5之家 2017-09-18 14:00 我要评论( )

ajax post get方式提交数据详解 ajax有两种提交数据的方式,分别为get和post。post方法可传输大于2K的数据,在Ajax里的应用不同之处在于:post方法的请求地址与传输的数据是放在两个对象里-请求地址放在open对象里,传输的数据放在send对象里;并且在传输数据之

ajax post get方式提交数据详解

ajax有两种提交数据的方式,分别为get和post。post方法可传输大于2K的数据,在Ajax里的应用不同之处在于:"post方法的请求地址与传输的数据是放在两个对象里—-请求地址放在open对象里,传输的数据放在send对象里;并且在传输数据之前定义一个传输文件HTTP头信息(setRequestHeader)"

用上循环就是为了在数据发送前进行合理的处理,解决在脚本语言对数据进行另外需求处理时出现的超时现象。处于对ajax认识未深,如有说得不对或不到位的,还请指教。

ajax post get方式提交数据详解

    ajax中的post方法有三个参数,前两个 参数是必须的,第三个参数根据需求而定。下图中画红色部分,如果你本身的编码就是utf8的就可以不用了。因为ajax本身默认的传送值以及本身都是用utf8编码,如果你用的是gbk编码则需要在数据传送之前进行转码。

ajax post get方式提交数据详解

  

  但是在服务器处理语言中还需要相应的转码配合,如

ajax post get方式提交数据详解

<SCRIPT LANGUAGE="网页特效">
function saveUserInfo(){
//获取接受返回信息层
var msg = document.getElementById("msg");
var f = document.user_info;
var userName = f.user_name.value;
var userAge = f.user_age.value;
var userSex = f.user_sex.value;
//接收表单的URL地址
var url = "commit.php教程";
//需要POST的值,把每个变量都通过&来联接
var postStr = "name="+ userName +"&age="+ userAge +"&sex="+ userSex;
//实例化Ajax
var ajax = null;
if(window.XMLHttpRequest){
ajax = new XMLHttpRequest();
}
else if(window.ActiveXObject){
ajax = new ActiveXObject("Microsoft.XMLHTTP");
}
else{
return;
}
//通过Post方式打开连接
ajax.open("POST", url, true);
//定义传输的文件HTTP头信息
ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//发送POST数据
ajax.send(postStr);
//返回数据的处理函数
ajax.onreadystatechange = function(){
if (ajax.readyState == 4 && ajax.status == 200){
msg.innerHTML = ajax.responseText;
}
}
}
</SCRIPT>
<form name="user_info">
姓名:<input type="text" name="user_name" /><br/>
年龄:<input type="text" name="user_age" /><br/>
性别:<input type="text" name="user_sex" /><br/>
<input type="button" value="提交表单" onClick="saveUserInfo()">
</form>
//构建一个接受返回信息的层:
<div id="msg"></div>

相关文章

  • Ajax的原理以及代码封装详解09-10
  • Java使用Ajax实现跨域上传图片功能09-06
  • 使用Ajax时处理用户session失效问题的解决方法08-03
  • jQuery AJAX中readyState与status的区别与联系07-11
  • js原生Ajax的封装和原理详解06-19
  • 使用bootstrap-paginator.js 分页来进行ajax 异步分页请求示例06-13
  • 文章评论

     

    1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

    相关文章
    • Ajax完整示例教程

      Ajax完整示例教程

      2017-09-18 14:01

    • 刚刚学习ajax,求解答

      刚刚学习ajax,求解答

      2017-09-18 10:21

    • 量化分析Ajax性能与应用决策

      量化分析Ajax性能与应用决策

      2017-09-18 10:11

    • springmvc处理ajax请求

      springmvc处理ajax请求

      2017-09-17 17:11

    网友点评
    n