最新需要学习如何使用 POST 提交方法的接口,正好看到了Ajax 版本的感觉不错分享给大家,欢迎高手指点。

<SCRIPT LANGUAGE=”javascript”>

<!–

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>

:
与get方法比较,post方法可传输大于2K的数据,在Ajax里的应用不同之处在于:”post方法的请求地址与传输的数据是放在两个对象里—-请求地址放在open对象里,传输的数据放在send对象里;并且在传输数据之前定义一个传输文件HTTP头信息(setRequestHeader)”
在commit.php文件里可以用变量$_POST[’name’] ,  $_POST[’age’],    $_POST[’sex’]获得send对象传输的数据.并对数据库进行操作.

Ajax的post方式提交数据的更多相关文章

  1. 前端ajax用post方式提交json数据给后端时,网络报错 415

    项目框架:spring+springmvc+mybatis 问题描述:前端ajax用post方式提交json数据给后端时,网络报错 415 前端异常信息:Failed to load resource ...

  2. 苹果微信浏览器不能post方式提交数据问题

    form表单中采用post方式提交数据时,在苹果的微信浏览器中无法传递,安卓的可以 如图: 在controller中获取该数据为 null 将表单的提交方式修改为get就能够获取到 现在采用Ajax方 ...

  3. Android 采用post方式提交数据到服务器

    接着上篇<Android 采用get方式提交数据到服务器>,本文来实现采用post方式提交数据到服务器 首先对比一下get方式和post方式: 修改布局: <LinearLayout ...

  4. 2016 系统设计第一期 (档案一)jQuery ajax serialize()方法form提交数据

    jQuery ajax serialize()方法form提交数据,有个很奇怪的问题,好像不能取到隐藏控件的值. //点击提交按钮保存数据 $('#btn_submitUser').click(fun ...

  5. Android(java)学习笔记213:开源框架post和get方式提交数据(qq登录案例)

    1.前面提到Http的get/post方式  . HttpClient方式,实际工作的时候不常用到,因为这些方式编写代码是很麻烦的 2.Android应用会经常使用http协议进行传输,网上会有很完善 ...

  6. Android 使用Post方式提交数据(登录)

    在Android中,提供了标准Java接口HttpURLConnection和Apache接口HttpClient,为客户端HTTP编程提供了丰富的支持. 在HTTP通信中使用最多的就是GET和POS ...

  7. Android 使用Post方式提交数据

    在Android中,提供了标准Java接口HttpURLConnection和Apache接口HttpClient,为客户端HTTP编程提供了丰富的支持. 在HTTP通信中使用最多的就是GET和POS ...

  8. Android(java)学习笔记156:开源框架post和get方式提交数据(qq登录案例)

    1. 前面提到Http的get/post方式  . HttpClient方式,实际工作的时候不常用到,因为这些方式编写代码是很麻烦的 2. Android应用会经常使用http协议进行传输,网上会有很 ...

  9. postman 中post方式提交数据

    post方式提交数据时,把参数填写在body中而不是pOST下面的哪一行

随机推荐

  1. Python学习笔记:wxPython(GUI图形用户界面)

    wxPython是一套基于Python的第三方GUI插件,可用Python制作丰富的图形化界面程序. 安装:pip install wxPython 或者 网站下载安装https://pypi.org ...

  2. nrf51822微信开发入门学习笔记1:开始前的准备

    参考:(id:love--baby)https://blog.csdn.net/hunhun1122/article/details/68922493 微信硬件平台:https://iot.weixi ...

  3. 剑指Offer(书):顺时针打印数组

    题目:输入一个矩阵,按照从外向里以顺时针的顺序依次打印出每一个数字,例如,如果输入如下4 X 4矩阵: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 则依次打印出数字1 ...

  4. Linux学习-服务器硬件数据的收集

    以系统内建 dmidecode 解析硬件配备 系统有个名为 dmidecode 的软件,它可以解析 CPU 型号.主板型号与内存相 关的型号等等~ [root@study ~]# dmidecode ...

  5. linux学习-主机的细部权限规划:ACL 的使用

    传统的权限仅有三种身份 (owner, group, others) 搭配三种权限 (r,w,x) 而已,并没有办法单纯的针对某一个使用者或某一个群 组来设定特定的权限需求,此时就得要使用 ACL 这 ...

  6. loj2030 「SDOI2016」储能表

    ref ref 一个点就是一个数对 \((x,y)\). 记状态 \(f[i][1/0][1/0][1/0]\) 和 \(g[i][1/0][1/0][1/0]\),其中三个 \(1/0\) 取值分别 ...

  7. 软件工程师应该关注的web攻击手段

    1.SQL注入------常见的安全性问题. 解决方案:前端页面需要校验用户的输入数据(限制用户输入的类型.范围.格式.长度),不能只靠后端去校验用户数据.一来可以提高后端处理的效率,二来可以提高后端 ...

  8. 使mysql的表内容可以输入中文内容

    修改数据库的字符集mysql>use mydb mysql>alter database mydb character set utf8;

  9. ccna学习指南第七版

    1.加电post自检    闪存查找ios 可随时从命令行进入设置模式,为此可在特权模式下输入setup    ctrl+c退出特权模式 6.2cli   命令行界面 进入cli router> ...

  10. 【bzoj2625】[Neerc2009]Inspection 有上下界最小流

    题目描述 You are in charge of a team that inspects a new ski resort. A ski resort is situated on several ...