1.用js实现前台无刷新,读取数据,主要实现方法大概如下:
首先根据浏览器类型创建1个适合的xmlHttp对象
然后打开xmlHttp.open("get",url,true);url可带所需参数
接着设置处理服务器响应的函数为一属性为:onreadystatechange=方法名;
接着在方法里写下当xmlHttp.readyState==4(即异步完成时的操作)
如读取返回的xml文件,var xmlDoc=xmlHttp.responseXML.documentElement;
代码是从别处找来,自己只做了点简单的总结,非原创如下:
/*AJAX 实例解释
上面的例子包含一个 HTML 表单,若干个保留所返回数据的 元素,以及指向一段 JavaScript 的链接:*/
<html>
<head>
<script src="selectcustomer_xml.js">script>
head>
<body>
<form action="">
<label>选择客户:
<select name="customers" onchange="showCustomer(this.value)">
<option value="ALFKI">Alfreds Futterkisteoption>
<option value="NORTS ">North/Southoption>
<option value="WOLZA">Wolski Zajazdoption>
select>label>
form>
<b><span id="companyname">span>b><br />
<span id="contactname">span><br />
<span id="address">span>
<span id="city">span><br/>
<span id="country">span>
body>
html>
/*上面的例子包含了一个 HTML 表单,该表单带有一个名为 "customers" 下拉框。
当用户选取下拉框中的客户时,函数 "showCustomer()" 就会被执行。事件 "onchange" 会触发该函数执行。换句话说,每当用户改变下拉框中的值时,函数 showCustomer() 就会被调用。
下面列出了 JavaScript 代码。
AJAX JavaScript
这是存储在文件 "selectcustomer_xml.js" 中的 JavaScript 代码:
*/
var xmlHttp
function showCustomer(str)
{
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
{
alert ("Your browser does not support AJAX!");
return;
}
var url="getcustomer_xml.asp";
url=url+"?q="+str;
url=url+"&sid="+Math.random();
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}
function stateChanged()
{
if (xmlHttp.readyState==4)
{
var xmlDoc=xmlHttp.responseXML.documentElement;
document.getElementById("companyname").innerHTML=
xmlDoc.getElementsByTagName("compname")[0].childNodes[0].nodeValue;
document.getElementById("contactname").innerHTML=
xmlDoc.getElementsByTagName("contname")[0].childNodes[0].nodeValue;
document.getElementById("address").innerHTML=
xmlDoc.getElementsByTagName("address")[0].childNodes[0].nodeValue;
document.getElementById("city").innerHTML=
xmlDoc.getElementsByTagName("city")[0].childNodes[0].nodeValue;
document.getElementById("country").innerHTML=
xmlDoc.getElementsByTagName("country")[0].childNodes[0].nodeValue;
}
}
function GetXmlHttpObject()
{
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;
}