加载中…ajax查询数据库，不刷新页面，等待对话框
(2013-05-13 15:33:48)
标签：
ajax网页设计php数据库网页开发it |
分类： 计算机 |
定义一个div，用在点击查询后，返回结果前显示一个等待对话框
正在查询数据，请稍后...
_httpRequest = new
ActiveXObject('Microsoft.XMLHTTP');
_httpRequest = new XMLHTTPRequest();
// 异常，创建对象实例失败
window.alert("请用IE访问！");
_httpRequest.open("POST", url, true);
_httpRequest.setRequestHeader("CONTENT-TYPE","application/x-www-form-urlencoded");
_httpRequest.onreadystatechange = callback;
}
if
(_httpRequest.readyState == 4)
if (_httpRequest.status ==
200)
document.getElementByIdx_x("datadiv").innerHTML =
_httpRequest.responseText;
}
}
定义javascript：
var url,content;
function init()
{
//显示等待对话框
document.getElementByIdx_x("divWaiting").style.display="";
url = "query.php";
if(window.ActiveXObject)
{
}
else if(window.XMLHTTPRequest)
{
}
if (!_httpRequest) {
}
if(_httpRequest)
{
_httpRequest.setRequestHeader("Content-Length",content.length);
_httpRequest.Send(content);
}
function query()
{
content = "year1="+document.getElementByIdx_x("year1").value;
content += "&month1=" +
document.getElementByIdx_x("month1").value;
content += "&year2=" +
document.getElementByIdx_x("year2").value;
content += "&month2=" +
document.getElementByIdx_x("month2").value;
content += "&from=1";
init();
}
function callback()
{
{
document.getElementByIdx_x("divWaiting").style.display="none";
//取消等待对话框
{
}
JS中定义AJAX方式查询数据库，其中用到responseText的POST方式传递参数
页面定义一个div
这个用来显示查询后显示的数据
php中：
header('Content-Type:text/html;charset=GB2312');
这句保证编码正确
$year1 = trim($_POST['year1']);
参数用法和正常form一样，最后的输出数据直接用echo返回即可。
喜欢
0
赠金笔
前一篇：萌小胖系列