php页面get方法实现ajax，入门实例教程

ajax，入门实例教程

本例针对php页面，做了一个小的demo加深对ajax的理解

1.文档结构：

共有ajax.php 和action.php 2个页面。

2.源码如下：

/*ajax.php页面*/<!DOCTYPE html><html lang="en"><head><title> ajax</title><script type="text/javascript">
function loadXMLDoc(){
var xmlhttp;
var q=document.getElementById("q").value;/*获取id为q的input的值*/
if (window.XMLHttpRequest){ xmlhttp=new XMLHttpRequest();//实例化ajax对象
  }
else{ //for ie5,6 兼容ie5,6
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}/**/xmlhttp.onreadystatechange=function()//每当 readyState 属性改变时，就会调用该函数
  {if (xmlhttp.readyState==4 && xmlhttp.status==200){document.getElementById("myDiv").innerHTML=xmlhttp.responseText;}}
xmlhttp.open("GET","action.php?q="+q,true);
xmlhttp.send();}
</script></head><body><div id="myDiv"><h2>Let AJAX change this text</h2></div><div><form action="action.php" ><p>123</p><input type="text" name="q" id="q"/>
<input type="button" onclick="loadXMLDoc()"  value="提交"/> </form></div></body></html>

/*action.php页面*/<?php
$value=$_GET['q'];echo $value;
?>

运行截图如下：

输入hello，运行结果截图如下：

可以看到第一行的内容被输入的内容替代，但input里的内容仍然存在，页面只是局部刷新了。

谢谢观看！

转载于:https://www.cnblogs.com/xiaogou/p/5369821.html

php页面get方法实现ajax，入门实例教程相关推荐

[转]React 入门实例教程
React 入门实例教程作者: 阮一峰日期: 2015年3月31日现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Native 发布,结果一天之内,就获 ...
视频教程-Swift5语言入门实例教程-Swift
Swift5语言入门实例教程 15年以上IT行业工作经验.8年以上IT行业教学经验.丰富的项目经验和授课经验,授课形式不拘一格.熟悉iOS开发,网页开发.Java开发.平面设计等技术,是一名经验丰富的 ...
读阮一峰的React 入门实例教程有感
读阮一峰的React 入门实例教程有感阮一峰的React入门实例教程其实我在一年前就读过,当时就想学习React,其实那个时候刚刚jQuery入门,啥也不懂,看得云里雾里,所以后来就没有继续研究下去 ...
Web Components入门实例教程
代码示例  <template id="UserNameTemplate"><style>.user-name { ...
Very Good!!! - React 入门实例教程
现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Native 发布,结果一天之内,就获得了 5000 颗星,受瞩目程度可见一斑. React 起源于 Face ...
React 入门实例教程(原作者：阮一峰)
转载(http://www.ruanyifeng.com/blog/2015/03/React.html) 现在最热门的前端框架,毫无疑问是 React . 上周,基于 react 的 React N ...
Reactjs 入门实例教程
来自:http://www.ruanyifeng.com/blog/2015/03/react.html 现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Na ...
Phaser 3 入门实例教程
Phaser是什么? Phaser是一个HTML5游戏框架,目的是为了快速地制作跨浏览器的HTML5游戏. 这个框架,主要发掘了现代浏览器(兼及桌面和移动两类系统)的优点,所以对浏览器的唯一要求是,就 ...
ajax入门实例代码,AJAX、AJAX实例及AJAX源代码
AJAX.AJAX实例及AJAX源代码作者:佚名来源:CNZZ 2008-1-4 AJAX介绍 AJAX 关键词: JavaScript脚本和可扩展标记语言(XML) WEB浏览器技术开放式WE ...

php页面get方法实现ajax，入门实例教程

php页面get方法实现ajax，入门实例教程相关推荐

最新文章

热门文章