Сокращение Ajax Code

Question

Я создаю полностью сайт на основе Ajax, поэтому все действия называет другую функцию JS, поэтому я использую этот код Ajax в каждой из моих функций, что делает мои функции большим кодом.

if (window.XMLHttpRequest) { 
    // code for IE7+, Firefox, Chrome, Opera, Safari 
    xmlhttp=new XMLHttpRequest(); 
} 
else { 
    // code for IE6, IE5 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
} 
xmlhttp.onreadystatechange=function() { 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) { 
     var getData=xmlhttp.responseText; 
     if(getData=="something") { 
      /* 
      code goes here 
      */ 
     } 
     else { 
      /* 
      code goes here 
      */ 
     } 
    } 
} 
xmlhttp.open("GET","mypage.php",true); 
xmlhttp.send(); 

Так что я хотел спросить, я должен использовать другую функцию, которая содержит только над Ajax кодекса и объявить свою переменную GetData во всем мире так, когда мне это нужно, я должен назвать его.

Вот как я хотел использовать

var getData=""; /*declaring var Globally (I read it like this dont know right)*/ 

function oneAjax(checkPage) { 
    if (window.XMLHttpRequest) { 
     // code for IE7+, Firefox, Chrome, Opera, Safari 
     xmlhttp=new XMLHttpRequest(); 
    } 
    else { 
     // code for IE6, IE5 
     xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    xmlhttp.onreadystatechange=function() { 
     if (xmlhttp.readyState==4 && xmlhttp.status==200) { 
      getData=xmlhttp.responseText; 
      /*now check further in the function which called it*/ 
     } 
    } 
    xmlhttp.open("GET",checkPage+".php",true); 
    xmlhttp.send(); 
} 

Будет ли создать какой-либо конфликт с другими текущими действиями? или предоставить мне какое-либо правильное решение для моей проблемы.

Answer 1

Если вы не собираетесь использовать библиотеку вне-полку, вы должны пройти «обратный вызов» в oneAjax:

function oneAjax(checkPage, done, fail) { 

    ... 

    xmlhttp.onreadystatechange = function() { 
     if (xmlhttp.readyState == 4) { 
      if (xmlhttp.status == 200) { 
       done(xmlhttp.responseText, xmlhttp.status); 
      } else { 
       fail(xmlhttp.status); 
      } 
      } 
    }; 

} 

Настройте параметры, передаваемые в функцию обратного вызова в соответствии с вашими требованиями.

Применение:

oneAjax('mypage', function(text, status) { 
    // success 
    console.log(status); 
}, function(status) { 
    // failure 
    console.log(status); 
}); 

Answer 2

почему бы вам не использовать Jquery или что-то вроде этого? Такая библиотека значительно сократит ваши заявления, и это будет намного проще писать.

Но если вы хотите сделать это самостоятельно, вы должны прочитать о обещаниях javascript. На MSDN есть хороший учебник, как решить вашу проблему: Asynchronous Programming in JavaScript with “Promises”

Answer 3

Я думаю, используя библиотеку JQuery будет лучше и обеспечить уровень абстракции более низкой

<!-- add a protocol if on local ex: http: --> 
<script src="//code.jquery.com/jquery-1.10.0.min.js"></script> 
$.ajax({ 
    type: "POST", 
    url: "some.php", 
    data: { name: "John", location: "Boston" } 
}).done(function(msg) { 
    alert("Data Saved: " + msg); 
}); 

Он также предлагает такие функции, как JSONP обойти проблемы с перекрестным доменом