web-dev-qa-db-fra.com

Comment utiliser AJAX pour actualiser automatiquement une div ou une page Web

J'essaie de faire cela depuis longtemps, mais je ne peux pas. Voici mon problème: J'ai une page Web comme celle-ci:

<html>
<body>
<div id="my_div">
<span id="txt">HELLO WORLD</span>
</div>
</body>
</html>

Maintenant, je veux que la div "my_div" se rafraîchit toutes les X secondes, actualisant également son contenu. Comment faire cela en utilisant AJAX ou JQUERY ou JAVASCRIPT?

Faites attention: je n'ai pas besoin d'un script qui rafraîchit la page entière. Faites attention (2): Je viens d'essayer de trouver quelque chose chez Google, mais je n'ai rien trouvé.

Aidez-moi, s'il vous plaît. J'ai eu ce problème depuis de nombreuses fois.

Merci d'avance!

5
gedamial

Utiliser jQuery load() et un minuteur est l’un des plus simples.

setInterval(function(){
   $('#my_div').load('/path/to/server/source');
}, 2000) /* time in milliseconds (ie 2 seconds)*/

load() est une méthode abrégée pour $.ajax

Cela suppose que vous configureriez un script côté serveur qui ne génère que le contenu de cet élément. Vous pouvez également utiliser un fragment de sélecteur dans load url pour analyser une page entière du contenu spécifique.

Voir la documentation de l'APIload ()

11
charlietfl

vous pouvez écrire des choses comme

var doSth = function () {

  var $md = $("#my_div");
  // Do something here
};
setInterval(doSth, 1000);//1000 is miliseconds
2
Kenny Tai Huynh

Avec jQuery, vous pouvez mettre à jour de manière dynamique le contenu d'un élément en utilisant:

$("#my_div").html("... new content ...");

Le nouveau contenu remplace le contenu d'origine.

En utilisant la méthode setInterval (), vous pouvez faire exécuter JavaScript à chaque période:

Par exemple:

window.setInterval(function() {
   $("#my_div").html("... new content ...");
}, 1000);

Remplacerait le contenu chaque seconde.

1
Kolban