简单ajax应用，个人参考笔记 -

ErnestChen

浏览: 109576 次
性别:
来自: 上海

最近访客更多访客>>

zhangweixing0

schdai

fanghoujun

pengfeifei26

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

简单ajax应用，个人参考笔记

博客分类：

php
javascript

ajax php 笔记应用案例

案例一：
ajax.html

<?xml version="1.0" encoding="UTF-8" ?>
<!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=UTF-8" />
<title>Insert title here</title>
<script language="javascript" src="ajax.js"></script>
</head>
<body>
<input type="text" name="myname" onmouseout="process()"/>
<input type="button" value="submit" onclick="process()" />
<div id="message"></div>
</body>
</html>

ajax.js

var xmlHttp;
xmlHttp = create_obj();
function create_obj() {
	var xmlHttp=null;
	try {
		// Firefox, Opera 8.0+, Safari
		xmlHttp = new XMLHttpRequest();
	} catch (e) {
		// Internet Explorer
		try {
			xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
		}
	}
	return xmlHttp;
}
function process() {
	name = document.getElementsByName("myname")[0].value;
	xmlHttp.open("GET", "ajax.php?name=" + name, true);
	xmlHttp.onreadystatechange = handle_f;
	xmlHttp.send(null);
}
function handle_f() {
	if (xmlHttp.readyState == 4) {
		if (xmlHttp.status == 200) {
			result = xmlHttp.responseText;
			c = document.getElementById("message");
			c.innerHTML = result;
		}else {
			alert(xmlHttp.statusText);
		}
	} 
}

ajax.php

<?php
$user=array("111","222","333","444","555");
if (in_array($_GET["name"],$user)) {
	echo $_GET["name"]." exist.";
}else {
	echo $_GET["name"]." not exist.";
}

案例二：
ajax_xml.html

<?xml version="1.0" encoding="UTF-8" ?>
<!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=UTF-8" />
<title>Insert title here</title>
<script language="javascript" src="ajax_xml.js"></script>
</head>
<body>
<select id="s_c" multiple="multiple" size="12" style="width: 160px;">
	<option value="111">111</option>
	<option value="222">222</option>
	<option value="333">333</option>
	<option value="444">444</option>
	<option value="555">555</option>
	<option value="666">666</option>
	<option value="777">777</option>
	<option value="888">888</option>
	<option value="999">999</option>
	<option value="1010">1010</option>
	<option value="1111">1111</option>
	<option value="1212">1212</option>
	<option value="1313">1313</option>
	<option value="1414">1414</option>
</select>
</br>
<input type="button" value="RandSelect" onclick="randSelect(1,10,3)" />
<input type="button" value="select" onclick="process()" />
<input type="button" value="refresh" onclick="refresh()" />
<div id="result"></div>
<p>

ajax_xml.js

var xmlHttp;
xmlHttp = create_obj();
function create_obj() {
	var xmlHttp = null;
	try {
		// Firefox, Opera 8.0+, Safari
		xmlHttp = new XMLHttpRequest();
	} catch (e) {
		// Internet Explorer
		try {
			xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
		}
	}
	return xmlHttp;
}
function createxmlcon() {
	var xml = "<members>";
	var options = document.getElementById("s_c").childNodes;
	var option = null;
	for ( var i = 0; i < options.length; i++) {
		option = options[i];
		if (option.selected) {
			xml = xml + "<member>" + option.value + "<\/member>";
		}
	}
	xml += "<\/members>";
	return xml;
}
function process() {
	var date = new Date();
	temp = date.getTime();
	var url = "ajax_xml.php?timestamp=" + temp;
	xmlcon = createxmlcon();
	xmlHttp.open("POST", url, true);
	xmlHttp.setRequestHeader("Content-type",
			"application/x-www-form-urlencoded");
	xmlHttp.setRequestHeader("Content-length", xmlcon.length);
	xmlHttp.onreadystatechange = handle_f;
	xmlHttp.send(xmlcon);
}
function handle_f() {
	if (xmlHttp.readyState == 4) {
		if (xmlHttp.status == 200) {
			parseResult();
		} else {
			alert(xmlHttp.statusText);
		}
	}
}
function parseResult() {
	var obj = document.getElementById("result");
	if (obj.hasChildNodes()) {
		obj.removeChild(obj.childNodes[0]);
	}
	text = xmlHttp.responseText;
	var obj_text = document.createTextNode(text);
	obj.appendChild(obj_text);
}
function refresh() {
	var options = document.getElementById("s_c");
	var option = "";
	for ( var i = 0; i < options.length; i++) {
		option = options[i];
		if (option.selected) {
			option.selected = false;
		}
	}
}
function randSelect(start, end, num) {
	var options = document.getElementById("s_c");
	var arr = new Array();
	if (start >= 0 && end >= start) {
		for ( var i = start, j = 0; i <= end; i++, j++) {
			arr[j] = i;
			if (options.selectedIndex >= 0) {
				options[i].selected = false;
			}
		}
	}
	if (num > arr.length || num < 0) {
		return false;
	} else {
		for ( var k = 0; k < num; k++) {
			var indexN = Math.floor(Math.random() * arr.length);
			for ( var i = 0; i < arr.length; i++) {
				if (i == indexN) {
					options[i].selected = true;
				}
			}
		}
	}
	// var options = document.getElementById("s_c");
	// randnum=Math.floor(Math.random()*10+1);
	// options[randnum].selected=true;
}

ajax_xml.php

<?php
header("Content-Type:text/html; charset=UTF-8");
$fp=fopen("php://input", "r+");
$data="";
while (!feof($fp)) {
	$data.=fread($fp, 4096);
}
fclose($fp);
$doc=new DOMDocument();
$doc->loadXML($data);
$root=$doc->getElementsByTagName("members");
$root=$root->item(0);
$userid=$root->getElementsByTagName("member");
foreach ($userid as $rootdata) {
	echo $rootdata->nodeValue;
	echo " ";
}

0
顶

1
踩

分享到：

新浪微博注册页面的用户体验分析报告（转载 ... | php给图片添加水印

2011-12-22 16:33
浏览 1195
评论(0)
分类:编程语言
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

简单ajax应用，个人参考笔记

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

简单ajax应用，个人参考笔记

评论

发表评论

相关推荐

javascript判断只能输入整数和小数

YUM-PHP环境搭建

LAMP，PHP环境搭建

Cannot use object of type stdClass as array

国内外常用大型经典论坛

Linux上全源码安装Apache、MySQL、PHP、WSF安装(转载)

Linux/Unix PHP环境搭建 一

php给图片添加水印

php制作缩略图图片

php简单验证码

php绘图（花）,饼图

php简单计数器

简单的文件上传、下载、计数、删除、重命名

javascript 表单验证（二）

javascript 表单验证 （一）

JavaScript 表单操作

JavaScript事件

DOM高级

JavaScript事件

常用正则表达式

最近访客更多访客>>

Linux/Unix PHP环境搭建一

javascript 表单验证（一）