Ajax的POST实例，index.html

<html>

<head>

<script type="text/javascript">

function showCustomer(str){

    var userName = str;

    var postStr   = "user_name="+ str;

    var xmlhttp;

    if (str==""){

        document.getElementById("txtHint").innerHTML="";

        return;

    }

    if (window.XMLHttpRequest){

        // code for IE7+, Firefox, Chrome, Opera, Safari

        xmlhttp=new XMLHttpRequest();

    } else {

        // code for IE6, IE5

        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

    }

    xmlhttp.onreadystatechange=function(){

        if (xmlhttp.readyState==4 && xmlhttp.status==200){

            document.getElementById("txtHint").innerHTML=xmlhttp.responseText;

        }

    }

    xmlhttp.open("POST","getcustomer.php",true);

    xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

    xmlhttp.send(postStr);

}

</script>

</head>

<body>

<form action="" style="margin-top:15px;">

<label>请选择一位客户：

<select name="customers" onchange="showCustomer(this.value)" >

<option value="APPLE">Apple Computer, Inc.</option>

<option value="BAIDU ">BAIDU, Inc</option>

<option value="Canon">Canon USA, Inc.</option>

<option value="Google">Google, Inc.</option>

<option value="Nokia">Nokia Corporation</option>

<option value="SONY">Sony Corporation of America</option>

</select>

</label>

</form>

<br />

<div id="txtHint">客户信息将在此处列出 ...</div>

</body>

</html>

getcustomer.php

<?php

print_r($_POST);

?>

============================================================

下面的实例是GET。index.html

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Ajax Get 传值</title>

</head>

<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 = "ajax_output2.php? user_name="+ userName +"&user_age="+ userAge +"&user_sex="+ userSex;

    //实例化Ajax

    //var ajax = InitAjax();

    var ajax = false;

    //开始初始化XMLHttpRequest对象

    if(window.XMLHttpRequest)

    {

        //Mozilla 浏览器

        ajax = new XMLHttpRequest();

        if (ajax.overrideMimeType)

        {//设置MiME类别

            ajax.overrideMimeType("text/xml");

        }

    }

    else if (window.ActiveXObject)

    {     // IE浏览器

        try

        {

            ajax = new ActiveXObject("Msxml2.XMLHTTP");

        }

        catch (e)

        {

            try

            {

                ajax = new ActiveXObject("Microsoft.XMLHTTP");

            } catch (e) {}

        }

    }

    if (!ajax)

    {

        // 异常，创建对象实例失败

        window.alert("不能创建XMLHttpRequest对象实例.");

        return false;

    }               

    //通过Post方式打开连接

    ajax.open("GET", url, true);

    //发送GET数据,已经在URL中赋了值所以send那里只要加个空参.

    ajax.send(null);

    //获取执行状态

    ajax.onreadystatechange = function()

    {

           //如果执行状态成功，那么就把返回信息写到指定的层里

           if (ajax.readyState == 4 && ajax.status == 200)

        {

            msg.innerHTML = ajax.responseText;

           }

    }

}

</script>

<body>

<div id="msg"></div>

<form name="user_info" method="post" action="">

<input type="text" name="user_name" style="display:none;" />

<input type="text" name="user_age" style="display:none;" />

<input type="text" name="user_sex" style="display:none;" />

<input type="button" value="获取服务器变量" onClick="saveUserInfo()">

</form>

</body>

ajax_output2.php

<?php

print_r($_GET);

?>

Ajax Post 与 Get 实例的更多相关文章

  1. 后台接受ajax传递值的实例代码

    后台接受ajax传递值的实例代码: 使用ajax可以实现无刷新数据交互,下面是一段后台代码接收ajax传递值的实例代码供需要的朋友参考,希望能够带来帮助. ajax代码如下: $(function ( ...

  2. Day21 Django之Form文件上传、原生Ajax和实现抽屉实例

    一.Form文件上传 """ Django settings for prev_chouti project. Generated by 'django-admin st ...

  3. PHP、jQuery、AJAX和MySQL 数据库实例

    index.html页面 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  4. jQuery ajax上传文件实例

    jQuery ajax上传文件实例 <form id="form" enctype="multipart/form-data"><input ...

  5. ASP.NET使用jQuery AJAX实现MD5加密实例

    一个asp.net ajax例子,使用jquery,实现md5加密.在.NET 4.0,Visual Studio 2010上成功运行. 效果体验:http://tool.keleyi.com/t/m ...

  6. Ajax应用-Ajax传输JSON数据实例

    ———————————————————— <script type="text/javascript">            var client;          ...

  7. Datatables插件1.10.15版本服务器处理模式ajax获取分页数据实例解析

    一.问题描述 前端需要使用表格来展示数据,找了一些插件,最后确定使用dataTables组件来做. 后端的分页接口已经写好了,不能修改.接口需要传入页码(pageNumber)和页面显示数据条数(pa ...

  8. 详解AJAX工作原理以及实例讲解（通俗易懂）

    什么是 AJAX ? AJAX = 异步 JavaScript 和 XML. AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味 ...

  9. SpringMVC+ajax文件上传实例教程

    原文地址:https://blog.csdn.net/weixin_41092717/article/details/81080152 文件上传文件上传是项目开发中最常见的功能.为了能上传文件,必须将 ...

随机推荐

  1. Linux查看可执行程序所在路径

    首先通过命令获得进程PID:如4285,然后执行下述命令 cd /proc/4285 ls -l 或直接ls -l /proc/4285 其中exe所在行即为可执行文件的全路经.如下图所示:

  2. (转)set集合的用法

    原地址:http://blog.csdn.net/chaiwenjun000/article/details/50561775 SET 集合 百度百科中说集合中的元素有三个特征: 1.确定性(集合中的 ...

  3. express－20 REST API和JSON

    简介 "Web服务"是一个通用术语,指任何可以通过HTTP访问的应用程序编程界面(API); 我们的重点是提供"REST风格"的服务,与其交互要更直接得多. R ...

  4. [工作中的设计模式]单例模式singleton

    一.模式解析: 单例模式是最简单和最常用的设计模式,面试的时候,不管新毕业的学生还是已经工作多年的筒子,对单例模式基本都能聊上两句.单例模式主要体现在如下方面: 1.类的构造函数私有化,保证外部不能直 ...

  5. 试听笔记：技术狂人nodejs

    nodejs概念: 让javascript运行在服务端的开发平台.不是一种语言,不是框架,不是库.特点:单线程异步.事件驱动. PHP.JAVA既是语言也是平台. 创始人:Ryan nodejs cm ...

  6. Bestcoder round #65 && hdu 5592 ZYB's Premutation 线段树

    Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 131072/131072 K (Java/Others)Total Submissio ...

  7. TeeChart Pro 5.0

    这是Delphi7自带例子 C:\Program Files\Borland\Delphi7\Demos\TeeChart 以下为翻译的文字,有部分不准确. TeeChart Pro 5.0是一个库 ...

  8. Android 插件开发，做成动态加载

    为什么需要插件开发: 相信你对Android方法数不能超过65K的限制应该有所耳闻,随着应用程序功能不断的丰富,总有一天你会遇到一个异常: Conversion to Dalvik format fa ...

  9. HDU 4778 Gems Fight!(DP)

    题目链接 当我放弃的时候过了.sb啊,卡常数!!! 换了好几个姿势,本来没写预处理,预处理+俩剪枝,尼玛就过了.. #include <stdio.h> #include <stri ...

  10. 【hdu2795】Billboard

    Problem Description At the entrance to the university, there is a huge rectangular billboard of size ...