<!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=gb2312" />
<title>无标题文档</title>
<script language="JavaScript">
function ajax(){
this.hInstXMLHTTP = this._construct();
}ajax.prototype._construct = function(){
if(window.ActiveXObject){
try{
hInstanceXMLHttpRequest = new ActiveXObject("Msxml2.XMLHTTP.4.0");
}catch(e){
try{
hInstanceXMLHttpRequest = new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
try{
hInstanceXMLHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
}catch(e){}
}
}
}
if(!hInstanceXMLHttpRequest){
hInstanceXMLHttpRequest = new XMLHttpRequest();
}
return hInstanceXMLHttpRequest?hInstanceXMLHttpRequest:false;
}ajax.prototype.init = function(fn2004,url){
if(this.hInstXMLHTTP === false) return; //不再往下执行
this.url = url
this.hInstXMLHTTP.open("GET",url,true);
this.hInstXMLHTTP.onreadystatechange = this.handleStateChange;
this.hInstXMLHTTP.send();
this.responseText = this.hInstXMLHTTP.responseText;
this.responseXML = this.hInstXMLHTTP.responseText;}ajax.prototype.handleStateChange = function(){
if(this.hInstXMLHTTP.status == 200 && this.hInstXMLHTTP.readyState == 4){ //这里提示错误。
eval(this.fn2004);
}
}
</script>
</head><body>
<div id="div1">hello,world!</div>
<input type="button" value="ajax取值" onclick="get()"/></body>
<script language="javascript">
function update(reponseText){
document.getElementById("div1").innerHTML = responseText;
}
function get(){
if(hInstAjax = new ajax()){
hInstAjax.init("update(this.reponseText)","ajax.php");
}
}
</script>
</html>提示:
Line:43
Char:2
Code:0
Error:'this.hInstXMLHTTP.status' 为空或不是对象
都是同一个类内成员函数,怎么就不能访问类内的成员呢?
要先判断readyState
if(this.hInstXMLHTTP.readyState == 4 && this.hInstXMLHTTP.status == 200){
ajax.prototype.handleStateChange = function(){
if(this.hInstXMLHTTP.readyState == 4 && this.hInstXMLHTTP.status == 200){
eval(this.fn2004);
}
}
结果一样,提示
Error:'this.hInstXMLHTTP.readyState' 为空或不是对象
Error:'hInstXMLHTTP' 未定义
没有问题
<script language="JavaScript">
function ajax(){
this.hInstXMLHTTP = this._construct();
}ajax.prototype._construct = function(){
if(window.ActiveXObject){
try{
hInstanceXMLHttpRequest = new ActiveXObject("Msxml2.XMLHTTP.4.0");
}catch(e){
try{
hInstanceXMLHttpRequest = new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
try{
hInstanceXMLHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
}catch(e){}
}
}
}
if(!hInstanceXMLHttpRequest){
hInstanceXMLHttpRequest = new XMLHttpRequest();
}
return hInstanceXMLHttpRequest?hInstanceXMLHttpRequest:false;
}ajax.prototype.init = function(fn2004,url){
if(this.hInstXMLHTTP === false) return; //不再往下执行
this.url = url
this.hInstXMLHTTP.open("GET",url,true);
this.hInstXMLHTTP.onreadystatechange = this.handleStateChange;
this.hInstXMLHTTP.send();
this.responseText = this.hInstXMLHTTP.responseText;
this.responseXML = this.hInstXMLHTTP.responseText;}ajax.prototype.handleStateChange = function(){ if(hInstAjax.hInstXMLHTTP.status == 200 && hInstAjax.hInstXMLHTTP.readyState == 4){ //这里提示错误。
eval(this.fn2004);
}
}
</script>
</head><body>
<div id="div1">hello,world!</div>
<input type="button" value="ajax取值" onclick="get()"/></body>
<script language="javascript">
function update(reponseText){
document.getElementById("div1").innerHTML = responseText;
}
function get(){
if(hInstAjax = new ajax()){
hInstAjax.init("update(this.reponseText)","ajax.php");
}
}
</script>
</html>
Line:39
Char:5
Code:0
Error:完成该操作所需的数据还不可使用。
if (xmlhttp.readyState == 4)
{
if (xmlhttp.status == 200)
{
do something
}
}
if(hInstAjax.hInstXMLHTTP.readyState == 4 && hInstAjax.hInstXMLHTTP.status == 200){
alert("执行到这里");//并没有提示这行信息,说明根本没执行到这里。问题一,你把this改成hInstAjax,与在类中增加
var obj = this;
再this.hInstXMLHTTP.onreadystatechange = this.handleStateChange(ojb); ajax.prototype.handleStateChange = function(obj){ if(ojb.hInstXMLHTTP.status == 200 && obj.hInstXMLHTTP.readyState == 4){
eval(this.fn2004);
}
}
一样的道理,但是我想问,handleStateChange是ajax类的成员函数,为什么不能直接访问类内的成员?是因为回调函数的特点?
ajax.prototype.handleStateChange = function(obj){ if(this.hInstXMLHTTP.status == 200 && this.hInstXMLHTTP.readyState == 4){
eval(this.fn2004);
}
}
是成员函数,但你这里的this不是ajax啊!是所谓的handleStateChange 。handleStateChange 下当然不存在hInstXMLHTTP对象了
感谢。我想进一步,请问我的类应该怎么写才好,我只是在试写ajax类。调用外部的回调函数用eval好吗?
因为回调函数一般不同页面有不同的处理,因此,打算把回调函数放出来,再把这个回调函数链接到ajax类,就行,但是回调函数要用到ajax类的的一些成员,比方responseText,这就把responseText当参数传过去,现在只想到eval方法。有什么更好的方法吗?或者提供一个较好的ajax类参考一下也好。网上我搜索过一些。
可能浏览器没这几个插件
Msxml2.XMLHTTP.4.0
Msxml2.XMLHTTP
Microsoft.XMLHTTP
检查一下是否有,如果在firefox肯定不行
建议你new一个XMLHttpRequest()
现在IE6以上和火狐都支持!
//初始化函数块
var query = function(){} ;
//把方法作为参数传入按顺序直到其中的一个成功执行
var Try = {
these: function() {
var returnValue ;
for (var i = 0, length = arguments.length; i < length; i++)
{
var lambda = arguments[i] ;
try {
returnValue = lambda() ;
break;
}
catch (e) {}
} return returnValue ;
}
};
//ajax应用,有xml方法和json方法可以到server端请求并返回数据
var ajax = query.prototype = {
create: function(){
return Try.these(
function() {return new XMLHttpRequest()},
function() {return new ActiveXObject('Msxml2.XMLHTTP')},
function() {return new ActiveXObject('Microsoft.XMLHTTP')}
) || false ;
},
xml: function(sXML , sURL){
var oXML = new ActiveXObject("MSXML2.DOMDocument") ;
oXML.async = false;
oXML.loadXML(sXML);
var xmlResult = this.post(oXML, sURL) ;
return xmlResult.xml ;
},
post: function(oXML , sURL){
var oXmlHttp = this.create() ;
oXmlHttp.Open("POST" , sURL , false) ;
oXmlHttp.Send(oXML) ; return oXmlHttp.responseXML ;
},
json: function(url , type){
var obj = this.create() ;
obj.open("POST" , url , false) ;
obj.send(null) ; if (obj.responseText != "") {
if (type == 'text'){
return obj.responseText ;
}
else {
eval("var data = " + obj.responseText) ;
return data ;
}
}
}
};