<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>爱人-爱人的大杂烩 &#187; ajax</title>
	<atom:link href="http://ai-2.cn/category/web/ajax/feed/" rel="self" type="application/rss+xml" />
	<link>http://ai-2.cn</link>
	<description>一切研究的资料库</description>
	<lastBuildDate>Tue, 24 Aug 2010 03:51:20 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0.1</generator>
		<item>
		<title>ajax的简单实现及源码(asp,php,jsp……)</title>
		<link>http://ai-2.cn/2009/02/ajax_demo_easy/</link>
		<comments>http://ai-2.cn/2009/02/ajax_demo_easy/#comments</comments>
		<pubDate>Wed, 11 Feb 2009 05:41:36 +0000</pubDate>
		<dc:creator>csecong</dc:creator>
				<category><![CDATA[ajax]]></category>
		<category><![CDATA[ajax源码]]></category>
		<category><![CDATA[ajax演示]]></category>
		<category><![CDATA[XMLHttpRequest]]></category>
		<category><![CDATA[xmlhttp组件]]></category>

		<guid isPermaLink="false">http://ai-2.cn/?p=31</guid>
		<description><![CDATA[ajax的简单实例源码及下载，用于用户名验证、字段验证等方面，使用ajax，页面的人性化操作更好，这段代码比较简单，演示了基本的ajax流程，看了这个，你就会发现，原来ajax其实并不复杂……]]></description>
			<content:encoded><![CDATA[<p>客户端ajax实现的简单说法，就是通过调用客户端的xmlhttp组件，远程得到数据，然后通过js赋值到页面的过程，所以，简单的说ajax分为以下几部分</p>
<p>1、调用xmlhttp组件</p>
<p>function GetXmlHttpObject(handler)<br />
{<br />
var objXmlHttp=null<br />
if (navigator.userAgent.indexOf(&#8220;Opera&#8221;)&gt;=0)<br />
{<br />
objXmlHttp=new XMLHttpRequest()<br />
objXmlHttp.onload=handler<br />
objXmlHttp.onerror=handler<br />
return objXmlHttp<br />
}<br />
if (navigator.userAgent.indexOf(&#8220;MSIE&#8221;)&gt;=0)<br />
{<br />
var strName=&#8221;Msxml2.XMLHTTP&#8221;<br />
if (navigator.appVersion.indexOf(&#8220;MSIE 5.5&#8243;)&gt;=0)<br />
{<br />
strName=&#8221;Microsoft.XMLHTTP&#8221;<br />
}<br />
try<br />
{<br />
objXmlHttp=new ActiveXObject(strName)<br />
objXmlHttp.onreadystatechange=handler<br />
return objXmlHttp<br />
}<br />
catch(e)<br />
{<br />
alert(&#8220;Error. Scripting for ActiveX might be disabled&#8221;)<br />
return<br />
}<br />
}<br />
if (navigator.userAgent.indexOf(&#8220;Mozilla&#8221;)&gt;=0)<br />
{<br />
objXmlHttp=new XMLHttpRequest()<br />
objXmlHttp.onload=handler<br />
objXmlHttp.onerror=handler<br />
return objXmlHttp<br />
}<br />
}</p>
<p>这里设定了根据客户端浏览器的不同调用不同的xmlhttp组件，IE下为Msxml2.XMLHTTP或Microsoft.XMLHTTP，而Firefox和opera浏览器下，则调用XMLHttpRequest()</p>
<p>2、使用xmlhttp得到远程页面数据</p>
<p>function showHint(str)<br />
{<br />
if (str.length &gt; 0)<br />
{<br />
var url=&#8221;gethint.asp?sid=&#8221; + Math.random() + &#8220;&amp;q=&#8221; + str<br />
xmlHttp=GetXmlHttpObject(stateChanged)<br />
xmlHttp.open(&#8220;GET&#8221;, url , true)<br />
xmlHttp.send(null)<br />
}<br />
else<br />
{<br />
document.getElementById(&#8220;txtHint&#8221;).innerHTML=&#8221;"<br />
}<br />
}<br />
function stateChanged()<br />
{<br />
if (xmlHttp.readyState==4 || xmlHttp.readyState==&#8221;complete&#8221;)<br />
{<br />
document.getElementById(&#8220;txtHint&#8221;).innerHTML=xmlHttp.responseText<br />
}else<br />
{<br />
document.getElementById(&#8220;txtHint&#8221;).innerHTML=&#8221;&lt;img src=&#8217;loading12.gif&#8217; width=&#8217;51&#8242; height=&#8217;36&#8242;&gt;&#8221;<br />
}<br />
}</p>
<p>这里一段说明的是，从网址gethint.asp得到数据，然后根据返回的情况将结果赋值到页面中的txtHint上</p>
<p>3、数据提供页面</p>
<p>在我们的演示中，是个asp的数据输出页面，其实，不论哪种语言，只要能根据要求输出结果就行，ajax的核心是xmlhttp，而不是数据来源，所以，不管是php ajax还是asp ajax，他们的ajax部分都是一样的，不同的只在数据提供页面上</p>
<p>这里提供一个asp版本ajax演示程序：<a title="asp的ajax演示程序" href="http://www.ai-2.cn/tools/ajax.rar" target="_blank">http://www.ai-2.cn/tools/ajax.rar</a></p>
]]></content:encoded>
			<wfw:commentRss>http://ai-2.cn/2009/02/ajax_demo_easy/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
