php AJAX POST的使用实例代码
程序员文章站
2022-06-24 16:24:00
ajax.html 程序代码 复制代码 代码如下:
ajax.html
程序代码
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<title>兼容多浏览器的ajax入门实例（超详细注释）</title>
<script type="text/javascript">
<!--
//ajax是建立在xmlhttp组件下的技术，本例详细语法参考压缩包内xmlhttp手册
var xmlhttp
//建立xmlhttp对象调用ms的activexobject方法，如果成功（ie浏览器）则使用ms activex实例化创建一个xmlhttp对象 非ie则转用建立一个本地javascript对象的xmlhttp对象（此方法确保不同浏览器下对ajax的支持）
function createxmlhttp(){
if(window.xmlhttprequest){ // mozilla 浏览器
xmlhttp = new xmlhttprequest();
}else if (window.activexobject){ // ie 浏览器
try{
xmlhttp = new activexobject("msxml2.xmlhttp");
}catch(e){
try{
xmlhttp = new activexobject("microsoft.xmlhttp");
}catch(e){}
}
}
}
//建立主过程
function startxmlhttp(){
createxmlhttp(); //建立xmlhttp 对象
var send_string="name="+document.getelementbyid("name").value;
send_string= encodeuri(send_string)
// alert(document.getelementbyid("text").value);
// return;
xmlhttp.onreadystatechange =dodo; //xmlhttp下的onreadystatechange方法控制传送过程
xmlhttp.open("post","ajax_show.php",true); //传送方式 读取的页面 异步与否
// xmlhttp.setrequestheader("cache-control","no-cache");
xmlhttp.setrequestheader("content-type","application/x-www-form-urlencoded");
xmlhttp.send(send_string); //发送
}
function dodo(){
if(xmlhttp.readystate==4){ // xmlhttp下的readystate方法 4表示传送完毕
if(xmlhttp.status==200){ // xmlhttp的status方法读取状态（服务器http状态码） 200对应ok 404对应not found（未找到）等
document.getelementbyid("content").innerhtml=xmlhttp.responsetext //xmlhttp的responsetext方法 得到读取页数据
}
}
}
-->
</script>
</head>
<body>
<span id="content">要替换的内容</span><br>
<input type="button" onclick="javascript:startxmlhttp()" value="ajax获取"/>
<form id="form1" name="form1" method="post" action="">
<label>
<input type="text" name="name" id="name" />
</label>
</form>
</body>
</html>
ajax_show.php
程序代码
<?php
$content = isset($_post['name']) ? $_post['name'] : '';
echo $content;
?>
程序代码
复制代码 代码如下:
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<title>兼容多浏览器的ajax入门实例（超详细注释）</title>
<script type="text/javascript">
<!--
//ajax是建立在xmlhttp组件下的技术，本例详细语法参考压缩包内xmlhttp手册
var xmlhttp
//建立xmlhttp对象调用ms的activexobject方法，如果成功（ie浏览器）则使用ms activex实例化创建一个xmlhttp对象 非ie则转用建立一个本地javascript对象的xmlhttp对象（此方法确保不同浏览器下对ajax的支持）
function createxmlhttp(){
if(window.xmlhttprequest){ // mozilla 浏览器
xmlhttp = new xmlhttprequest();
}else if (window.activexobject){ // ie 浏览器
try{
xmlhttp = new activexobject("msxml2.xmlhttp");
}catch(e){
try{
xmlhttp = new activexobject("microsoft.xmlhttp");
}catch(e){}
}
}
}
//建立主过程
function startxmlhttp(){
createxmlhttp(); //建立xmlhttp 对象
var send_string="name="+document.getelementbyid("name").value;
send_string= encodeuri(send_string)
// alert(document.getelementbyid("text").value);
// return;
xmlhttp.onreadystatechange =dodo; //xmlhttp下的onreadystatechange方法控制传送过程
xmlhttp.open("post","ajax_show.php",true); //传送方式 读取的页面 异步与否
// xmlhttp.setrequestheader("cache-control","no-cache");
xmlhttp.setrequestheader("content-type","application/x-www-form-urlencoded");
xmlhttp.send(send_string); //发送
}
function dodo(){
if(xmlhttp.readystate==4){ // xmlhttp下的readystate方法 4表示传送完毕
if(xmlhttp.status==200){ // xmlhttp的status方法读取状态（服务器http状态码） 200对应ok 404对应not found（未找到）等
document.getelementbyid("content").innerhtml=xmlhttp.responsetext //xmlhttp的responsetext方法 得到读取页数据
}
}
}
-->
</script>
</head>
<body>
<span id="content">要替换的内容</span><br>
<input type="button" onclick="javascript:startxmlhttp()" value="ajax获取"/>
<form id="form1" name="form1" method="post" action="">
<label>
<input type="text" name="name" id="name" />
</label>
</form>
</body>
</html>
ajax_show.php
程序代码
复制代码 代码如下:
<?php
$content = isset($_post['name']) ? $_post['name'] : '';
echo $content;
?>