2013-08-19 3 views
0

Я пытаюсь создать небольшой скрипт ajax, который добавляет некоторый текст в div. ничего не случилось, это убивает меня.Простой ajax ничего не происходит

, пожалуйста, помогите.

HTML:

<!DOCTYPE> 
    <html> 

    <head> 
       <script type="text/javascript" src="ajax.js"></script> 
       <script type="text/javascript" src="jquery.js"></script> 
    </head> 

    <body onload="process()"> 
     OK, you made it this far 
     <br/> 
     <div id="theD"> 
     </div> 

    </body> 

    </html> 

ajax.js:

var xmlHttp= createXmlHttpRequestObject(); 

    function createXmlHttpRequestObject(){ 
     var xmlHttp; 

     if (window.XMLHttpRequest)(
      xmlHttp = new XMLHttpRequest(); 
     )else{ 
      xmlHttp = new ActiveXObject("Microsoft.XMLHTTP") 
     } 

     return xmlHttp; 
    } 


    function process(){ 
     alert('hi'); 

     if (xmlHttp){ 
      try{ 
       xmlHttp.open("GET", "ajax.txt", true); 
       xmlHttp.onreadystatechange = handleServerResponse; 
       xmlHttp.send(null); 

      }catch(e){ 
       alert(e.toString()); 

      } 
     } 
    } 

    function handleServerResponse(){ 
     theD = documet.getElementById('theD'); 

     if (xmlHttp.readyState==1){ 
      theD.innerHTML += "Status1:server connection established <br/>"; 

     }else if (xmlHttp.readyState==4){ 
      if (xmlHttp.status=200){ 
       try{ 
        text=xmlHttp.responseText 
        theD.innerHTML += "Status4:request finish<br/>"; 
        theD.innerHTML += text; 
      }catch(e){ 
       alert(e.toString); 

      } 

      }else{ 
       alert((xmlHttp.statusText); 
      } 
     } 

    } 

ajax.txt содержит простую строку.

+4

Если вы используете JQuery, почему в мире вы делаете на AJAX в виде обычного JS? – j08691

+1

Что значит «ничего не происходит»? Вы видите какие-либо предупреждения? Вы проверили консоль на наличие ошибок? –

+2

'$ .get ('ajax.txt'). Done (function (result) {alert (result);}). Fail (function() {alert ('failed, check console'); console.log (arguments) ;}); ' –

ответ

1

Это xhr2, если вы хотите больше поддержки браузера, вы можете продлить его.

http://caniuse.com/xhr2

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>ajax</title> 
<script> 
function ajax(a,b,c){ // Url, Callback, just a placeholder 
c=new XMLHttpRequest; 
c.open('GET',a); 
c.onload=b; 
c.send() 
} 
function h(){ 
document.getElementById('theD').innerText=this.response 
} 
window.onload=function(){ 
ajax('ajax.txt',h); 
} 
</script> 
</head> 
<body> 
<div id="theD"></div> 
</body> 
</html> 

если у вас есть какие-либо вопросы о том, как это работает и как вы можете продлить его просто спросить

здесь у вас есть еще некоторая информация об этом

https://stackoverflow.com/a/18309057/2450730

вы можете добавить, то есть опору

заменой

c=new XMLHttpRequest; 

с

c=new XMLHttpRequest||new ActiveXObject("MSXML2.XMLHTTP.3.0"); 

и с помощью onreadystatechange

Смежные вопросы