天天看點

解決ajax跨域問題的執行個體

要解決ajax跨域問題,網上給出的方法有二:

1是建構伺服器端的代理。簡而言之,就是ajax中調用的實質還是本機的url,而伺服器端替js去取回遠端位址。

2.利用script标記,生成一個标簽。在js加載完成後,再執行後續操作。

就是将原來建立xmlHTTPrequest對象的操作改成了建立script标簽的操作.

這裡給出一個例子:

#ajah.js

var  Ajah=function(url,varname,handleSuccess,handleFailure){ 

        script = document.createElement("script"); 

        script.src=url; 

        var handler = function(str) 

        { 

                handleSuccess(str); 

        } 

        script.onload = function() 

        { 

                var json=eval(varname); 

                handler(json); 

        } 

        if(window.ie) 

        { 

                script.onreadystatechange = function() 

                { 

                        if(script.readyState=='complete'||script.readyState== 'loaded') 

                        { 

                                var json=eval(varname); 

                                if(typeof json != 'undefined') 

                                { 

                                        handler(json); 

                                } 

                        } 

                } 

        } 

        document.body.appendChild(script); 

}

而在網頁中應這樣調用:

#demo.html

<pre> 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 3.2//EN"> 

<html> 

<head> 

  <meta name="generator" content= 

  "HTML Tidy for Linux (vers 1 September 2005), see www.w3.org"> 

  <title></title> 

        <script src="mootools.js"></script> 

        <script src="ajah.js"></script> 

</head> 

<body> 

<script> 

var ajah=new Ajah("data.js","json198",function(str){

  console.debug("returned:"); 

        console.debug(str); 

}, 

function(str){}); 

</script> 

</body> 

</html> 

</pre>

被調用的資料檔案如下

#data.js

var json198="hello,this is json198";

funciton Ajah(url,varname,handleSuccess,handleFailure){…}

Ajah這個構造函數調用四個參數:

url:遠端位址

varname:遠端傳回資料的變量名

handleSuccess:加載完畢後加載的函數

handleFailure:暫時沒用上

繼續閱讀