729 votes

Comment faire un appel ajax sans jquery ?

<p>Comment faire un appel ajax en utilisant javascript, sans utilisation de jquery ?</p>

568voto

dov.amir Points 3126
<p>Avec « vanille » JavaScript :<pre><code></code></pre><p>Avec jQuery :</p><pre><code></code></pre></p>

214voto

Petah Points 18432
<p>À l’aide de l’extrait de code suivant vous pouvez faire des choses semblables assez facilement, comme ceci :<pre><code></code></pre><p>Voici l’extrait :</p><pre><code></code></pre></p>

102voto

AbdelHady Points 576
<p>Vous pouvez utiliser la fonction suivante :<pre><code></code></pre><p>Vous pouvez essayer en ligne des solutions similaires sur ces liens :</p><ul> <li><a href="http://www.w3schools.com/ajax/tryit.asp?filename=tryajax_first">http://www.w3schools.com/Ajax/tryit.asp?filename=tryajax_first</a></li> <li><a href="http://www.w3schools.com/ajax/tryit.asp?filename=tryajax_callback">http://www.w3schools.com/Ajax/tryit.asp?filename=tryajax_callback</a></li> </ul></p>

36voto

3nigma Points 21164
<pre><code></code><p><a href="http://ajaxpatterns.org/XMLHttpRequest_Call">http://AjaxPatterns.org/XMLHttpRequest_Call</a></p></pre>

28voto

brunops Points 112

Vous pouvez obtenir l'objet correct en fonction du navigateur avec

 function getXmlDoc() {
  var xmlDoc;

  if (window.XMLHttpRequest) {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlDoc = new XMLHttpRequest();
  }
  else {
    // code for IE6, IE5
    xmlDoc = new ActiveXObject("Microsoft.XMLHTTP");
  }

  return xmlDoc;
}
 

Avec l'objet correct, un GET peut être extrait de:

 function myGet(url, callback) {
  var xmlDoc = getXmlDoc();

  xmlDoc.open('GET', url, true);

  xmlDoc.onreadystatechange = function() {
    if (xmlDoc.readyState === 4 && xmlDoc.status === 200) {
      callback(xmlDoc);
    }
  }

  xmlDoc.send();
}
 

Et un POST pour:

 function myPost(url, data, callback) {
  var xmlDoc = getXmlDoc();

  xmlDoc.open('POST', url, true);
  xmlDoc.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

  xmlDoc.onreadystatechange = function() {
    if (xmlDoc.readyState === 4 && xmlDoc.status === 200) {
      callback(xmlDoc);
    }
  }

  xmlDoc.send(data);
}
 

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by: