Ajax Post 与 Get 实例
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 实例的更多相关文章
- 后台接受ajax传递值的实例代码
后台接受ajax传递值的实例代码: 使用ajax可以实现无刷新数据交互,下面是一段后台代码接收ajax传递值的实例代码供需要的朋友参考,希望能够带来帮助. ajax代码如下: $(function ( ...
- Day21 Django之Form文件上传、原生Ajax和实现抽屉实例
一.Form文件上传 """ Django settings for prev_chouti project. Generated by 'django-admin st ...
- PHP、jQuery、AJAX和MySQL 数据库实例
index.html页面 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...
- jQuery ajax上传文件实例
jQuery ajax上传文件实例 <form id="form" enctype="multipart/form-data"><input ...
- ASP.NET使用jQuery AJAX实现MD5加密实例
一个asp.net ajax例子,使用jquery,实现md5加密.在.NET 4.0,Visual Studio 2010上成功运行. 效果体验:http://tool.keleyi.com/t/m ...
- Ajax应用-Ajax传输JSON数据实例
———————————————————— <script type="text/javascript"> var client; ...
- Datatables插件1.10.15版本服务器处理模式ajax获取分页数据实例解析
一.问题描述 前端需要使用表格来展示数据,找了一些插件,最后确定使用dataTables组件来做. 后端的分页接口已经写好了,不能修改.接口需要传入页码(pageNumber)和页面显示数据条数(pa ...
- 详解AJAX工作原理以及实例讲解(通俗易懂)
什么是 AJAX ? AJAX = 异步 JavaScript 和 XML. AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味 ...
- SpringMVC+ajax文件上传实例教程
原文地址:https://blog.csdn.net/weixin_41092717/article/details/81080152 文件上传文件上传是项目开发中最常见的功能.为了能上传文件,必须将 ...
随机推荐
- 阿里云 OSS+CDN
https://promotion.aliyun.com/ntms/ossedu2.html https://www.aliyun.com/act/aliyun/ossdoc.html 对象存储(Ob ...
- 读懂Android项目结构目录
我们看到下图:当我们创建了第一Android项目的时候有没有被吓到.怎么这么多目录,好头晕啊!没事, 那我们今天就了解一下这些目录是做什么的: src: src 目录是放置我们所有 Java 代码的地 ...
- 宫格布局实例(注意jquery的版本号要统一)
<!DOCTYPE html><html><head><meta charset="utf-8" /><style> * ...
- 《DSP using MATLAB》示例Example5.5
代码: %% ---------------------------------------------------------- %% START N=5 %% ------------------ ...
- matlab坐标外围背景变白色
set(gcf,'Color',[1,1,1]) 默认图片是这样的: 出图之前使用命令,外围变白后效果如下:
- css3 -- 浏览器支持
浏览器支持的前缀: 1.浏览器兼容前缀 -webkit-transform:rotate(-3deg); /*为Chrome/Safari*/ -moz-transform:rotate(-3deg) ...
- 1140 分珠 dfs
时间限制:500MS 内存限制:65536K提交次数:24 通过次数:18 题型: 编程题 语言: G++;GCC Description 如下图所示,有若干珠子,每颗珠子重量不同,珠子之间有一 ...
- 17243 Huzi酱和他的俄罗斯套娃(贪心)
时间限制:500MS 内存限制:65535K 提交次数:15 通过次数:4 收入:12 题型: 编程题 语言: C++;C Description Huzi酱是个非常贪玩的人,除了魔方他还喜欢各 ...
- HDU4971 A simple brute force problem.(强连通分量缩点 + 最大权闭合子图)
题目 Source http://acm.hdu.edu.cn/showproblem.php?pid=4971 Description There's a company with several ...
- BZOJ2597 [Wc2007]剪刀石头布(最小费用最大流)
题目大概是说n个人两两进行比赛,问如何安排几场比赛的输赢使得A胜B,B胜C,C胜A这种剪刀石头布的三元组最多. 这题好神. 首先,三元组总共有$C_n^3$个 然后考虑最小化不满足剪刀石头布条件的三元 ...