Rafraichir HTML dans la page à intervalle donné.

**hub73** · 27/06/2021, 16h39

Bonjour à vous.
Je souhaite inclure dans ma page php un fichier html toute les 3 secondes pour actualiser l'information de la page.

L'inclusion fonctionne avec le code suivant.

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
	$chaine .=	"$(document).ready(function() {" ."\n";
	$chaine .=	"$(\"#content\").load(\"html/encours.html\");" ."\n";
	$chaine .= "});"."\n";

Par contre je ne parviens pas à faire fonctionner ce code en ajoutant la fonction setIinterval pour actualiser le contenu sans recharger la page toutes les 3 secondes.

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
	$chaine .=	"$(document).ready(function() {" ."\n";
	$chaine .=	"setInterval($(\"#content\").load(\"html/encours.html\"),3000);" ."\n";
	$chaine .= "});"."\n";

J'utilise JQuery.
La page concernée est ici : http://www.lesfloralies.info/program..._floralies.php

Merci à vous pour vos conseils. Je ne vois pas mon erreur.

**hub73** · 27/06/2021, 16h41

Je poste l'intégralité du code de la page, si c'est utile

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
<?php
	// ---------------------------------
	//
	// pour le site Radio Les Floralies
	//
	// ---------------------------------
	// Code : Hubert BAYRE, avril 2021.
 
    $delai = 30; 
    $url = "http://www.lesfloralies.info/programme/programme_radio_les_floralies.php";
 
    //header("Refresh: $delai;url=$url");	
    header('Content-Type: text/html; charset=utf-8');
 
		ini_set("display_errors", 0);
 
	//phpinfo();
 
	setlocale(LC_ALL, 'fr_FR');
 
	$chaine = "<html>" ."\n";
 
	$chaine .= "<head>" ."\n";
	$chaine .= "<title>Radio Les Floralies - Le Programme</title>" ."\n";
 
	$chaine .= "<link rel='stylesheet' type='text/css' href='style.css' media='all'>" ."\n";
 
	// player
	$chaine .= "<link rel='icon' type='image/png' href='img/favicon.png' />" ."\n";
	$chaine .= "<meta name='viewport' content='width=device-width, initial-scale=0.8, maximum-scale=0.8' />" ."\n";
	$chaine .= "<meta property='og:type' content='music.radio_station' />" ."\n";
	$chaine .= "<meta property='og:image' content='img/social.png' />" ."\n";
	$chaine .= "<meta name='twitter:image' content='img/social.png'>" ."\n";
	//
 
 
	$chaine .= "</head>" ."\n";
 
	$chaine .= "<body>" ."\n";
	$chaine .= "<p>&nbsp</p>" ."\n";
 
	$chaine .= " <script type=\"text/javascript\" src=\"https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js\"></script>";
 
	$chaine .=	"<script>" ."\n";
 
	$chaine .=	"$(document).ready(function() {" ."\n";
	$chaine .=	"$(\"#content\").load(\"html/encours.html\");" ."\n";
	$chaine .= "});"."\n";
 
	//$chaine .=	"$(document).ready(function() {" ."\n";
	//$chaine .=	"setInterval($(\"#content\").load(\"html/encours.html\"),3000);" ."\n";
	//$chaine .= "});"."\n";
 
 
	$chaine .=	"	</script>"."\n";
 
	$chaine .= "<p align='center'>" ."\n";
	$chaine .= " - <a href='http://www.lesfloralies.info'>Retour à la page d'accueil</a> - " ."\n";
	$chaine .= "</p>" ."\n";    		
 
	$chaine .= "<p>&nbsp</p>" ."\n";
 
	$chaine .= "<p align='center' class='titre'>LA GRILLE DES PROGRAMMES</p>" ."\n";
	$chaine .= "<p align='center'>"  ."\n";
	$chaine .= "<a href='http://www.lesfloralies.info'>" ."\n";
	$chaine .= "<img src='html/images/logo_radio_programme.png'>" ."\n";
	$chaine .= "</a>" . "\n";
	$chaine .= "</p>" ."\n";
	$chaine .= "<div align='center'>" ."\n";
	$chaine .= "<p align='center'>" ."\n";
	$chaine .= "En cours de diffusion : " ."\n";
	$chaine .= "</p>" ."\n";
	$chaine .= "<div align='center' id='content'>" ."\n";
 
	$chaine = utf8_encode ($chaine);
	echo $chaine;
 
//		$chaine .= "<div id='content'></div>" ."\n";
 
 
	// include("html/encours.html");
 
	$chaine = "</div>" ."\n";
	$chaine = utf8_encode ($chaine);
	echo $chaine;
 
	$chaine .= "<div align='center'>" ."\n";
 
	$chaine .= "<p align='center'> - " ."\n";
	$chaine .= "<a href='?Heure=00'>00h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=01'>01h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=02'>02h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=03'>03h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=04'>04h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=05'>05h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=06'>06h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=07'>07h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=08'>08h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=09'>09h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=10'>10h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=11'>11h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=12'>12h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=13'>13h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=14'>14h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=15'>15h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=16'>16h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=17'>17h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=18'>18h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=19'>19h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=20'>20h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=21'>21h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=22'>22h</a> - " ."\n";				
	$chaine .= "<a href='?Heure=23'>23h</a> - " ."\n";				
	$chaine .= "</p>" ."\n";				
 
	$chaine = utf8_encode ($chaine);	
	echo $chaine;
 
	if ($_GET['Heure'] != "")
	{
		$hr = $_GET['Heure'];
	}
	else
	{
		$hr = date("H");
	}
 
	$chaine = "<table>" ."\n";
	$chaine = utf8_encode ($chaine);
	echo $chaine;
 
	$chaine .= "<p>&nbsp</p>" ."\n";
 
	$chaine = utf8_encode ($chaine);
	echo $chaine;
 
	include("html/programme_" . $hr ."h.html");
 
	$chaine = "</table>" ."\n";
	$chaine = utf8_encode ($chaine);
	echo $chaine;
 
 
	// player 
	$chaine = "<div id='playerall'><div class='dragscroll' id='mosaicradio'><div class='dragscroll'><div class='alignmosaicradio'><button onclick=\"document.getElementById('mosaicradio').classList.toggle('mosaicclosed')\"><img src='img/close.png'></button>" ."\n";
	$chaine .= "<ul>"."\n";
	$chaine .= "<ul>"."\n";
	$chaine .= "<li><a href='http://hbayre.fr/radio/player/' target='_self'><img src='img/radios/radio1.png'></a></li>" ."\n";
	$chaine .= "<li><a href='#' target='_self'><img src='img/radios/radio6.png'></a></li>" ."\n";
	$chaine .= "</ul>" ."\n";
	$chaine .= "</div></div></div><div id='playercontent'><div id='nav'> <div id='icoradio'><img src='img/radio.png'/></div><div id='currentSong'><span id='wrt_artist'></span> - <span id='wrt_title'></span></div><div id='coversong'><span id='wrt_covers'></span></div></div><div id='logo'></div><div id='center'> <div id='playstop'> <div id='centerplaystop'> <div id='jquery_jplayer_1' class='jp-jplayer'> <audio id='jp_audio_0' preload='metadata'></audio> </div><div id='jp_container_1' class='jp-audio'> <ul> <li> <a href='javascript:;' class='jp-play' style='display: block;'><img src='img/play.png'></a> </li><li> <a href='javascript:;' class='jp-pause' style='display: none;'><img class='animated infinite tada' src='img/pause.png'></a> </li></ul> </div></div></div><div id='pub'><div id='divpub'> <div id='adsense'>" ."\n";
	$chaine .= "</div></div></div><div id='lastplay'><div class='alignlastplay'><div class='lpallelem'><span id='wrt_song_history_1_covers'></span><span class='currentSong' id='wrt_song_history_1_artist'></span></br><span class='lptitle' id='wrt_song_history_1_title'></span></div><div class='lpallelem'><span id='wrt_song_history_2_covers'></span><span class='currentSong' id='wrt_song_history_2_artist'></span></br><span class='lptitle' id='wrt_song_history_2_title'></span></div><div class='lpallelem'><span id='wrt_song_history_3_covers'></span><span class='currentSong' id='wrt_song_history_3_artist'></span></br><span class='lptitle' id='wrt_song_history_3_title'></span></div><div class='lpallelem'><span id='wrt_song_history_4_covers'></span><span class='currentSong' id='wrt_song_history_4_artist'></span></br><span class='lptitle' id='wrt_song_history_4_title'></span></div><div class='lpallelem'><span id='wrt_song_history_5_covers'></span><span class='currentSong' id='wrt_song_history_5_artist'></span></br><span class='lptitle' id='wrt_song_history_5_title'></span></div></div></div><div id='mobilemenu'><button onclick=\"document.getElementById('lastplay').classList.remove('closed');document.getElementById('mosaicradio').classList.toggle('mosaicclosed')\"><img class='lpvolume' src='img/mosaique.png'></button><button onclick=\"document.getElementById('mosaicradio').classList.remove('mosaicclosed');document.getElementById('lastplay').classList.toggle('closed')\"><img class='lpvolume' src='img/lastplay.png'></button></div><div id='player'> <div id='jquery_jplayer_1' class='jp-jplayer'> <audio id='jp_audio_0' preload='metadata'></audio> </div><div id='jp_container_1' class='jp-audio'> <div id='volume'><div id='centervolume'><ul><li><button onclick=\"document.getElementById('lastplay').classList.remove('closed');document.getElementById('mosaicradio').classList.toggle('mosaicclosed')\"><img class='lpvolume' src='img/mosaique.png'></button> </li><li> <a href='javascript:;' class='jp-mute' title='mute'><img src='img/volume_mute.png'></a> </li><li> <a href='javascript:;' class='jp-unmute' title='unmute' style='display: none;'><img src='img/volume_unmute.png'></a> </li><li class='volume'> <div class='jp-volume-bar'> <div class='jp-volume-bar-value'></div></div></li><li> <a href='javascript:;' class='jp-volume-max' title='max volume'><img src='img/volume_max.png'></a> </li><li> <button onclick=\"document.getElementById('mosaicradio').classList.remove('mosaicclosed');document.getElementById('lastplay').classList.toggle('closed')\"><img class='lpvolume' src='img/lastplay.png'></button> </li></ul></div></div></div></div><div id='social'><ul class='social'>" ."\n";
	$chaine .= "</ul></div></div></div></div><link href='css/style.css' rel='stylesheet' type='text/css'><link href='config/color.css' rel='stylesheet' type='text/css'></script><script type='text/javascript' src='//code.jquery.com/jquery-1.9.1.js'></script><script type='text/javascript' src='//code.jquery.com/ui/1.10.3/jquery-ui.js'></script><script type='text/javascript' src='config/config.js'></script><script type='text/javascript' src='js/audio.js'></script><script type='text/javascript' src='js/jquery.jplayer.min.js'></script><script type='text/javascript' src='js/scroll.js'></script><script type='text/javascript' src='//ajax.webradio.tools/3.5.2/webradio.tools.min.js'></script>" ."\n";
	$chaine .= "<p align='center'>Player ci-dessus développé par MRMAZURE</p>" ."\n";
 
	$chaine = utf8_encode ($chaine);
	echo $chaine;
	// 
 
 
	$chaine = "<div>" ."\n";
	$chaine .= "<p align='center'>" ."\n";
	$chaine .= " - <a href='http://www.lesfloralies.info'>Retour à la page d'accueil</a> - " ."\n";
	$chaine .= "</p>" ."\n";    		
	$chaine .= "</div>" ."\n";
	//$chaine .= "<script src='ajax.js' type='text/javascript'></script>";
	$chaine .= "</body>" ."\n";
	$chaine .= "</html>" ."\n";
 
	$chaine = utf8_encode ($chaine);
	echo $chaine;
 
?>

**mathieu** · 28/06/2021, 15h13

est ce que c'est le code qui génère la page suivante ?
http://www.lesfloralies.info/program..._floralies.php

**hub73** · 28/06/2021, 23h28

oui c'est bien le code de cette page.

Rafraichir toute la page, ce n'est pas ma demande. C'était l'existant ( $delai = 30; $url = "http://www.lesfloralies.info/programme/programme_radio_les_floralies.php"; //header("Refresh: delai;url=$url")

Mon logiciel de webradio (en purebasic) qui fonctionne sur un ordinateur windows lit des fichier ogg, envoi des requetes get à un autre page php pour créer le contenu html (https://www.lesfloralies.info/progra...l/encours.html) qui est ensuite inclus dans cette page . Lorsque le logiciel lit un autre fichier sonore, il met à jour encours.html. (C'est le même logiciel qui créé également le reste, la grille des programmes par heure.)

Sans rafraichir la totalité de cette page, je veux mettre à jour toutes les 3 secondes l'inclusion /encours.html ... d'ou ajax. (Avant Ajax il y avait juste une include ("https://www.lesfloralies.info/programme/html/encours.html") et un rafraichissement total de la page via la commande header en php).

Je suis donc passé à de l'ajax, cela fonctionnerait, seul bémol je ne sais pas rafraichir toutes les 3 secondes en ajax.

Merci à vous.

**mathieu** · 29/06/2021, 06h42

je crois que le souci est juste que "setInterval" a besoin d'une fonction donc essayez cela :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
	$chaine .=	"$(function () {
 
			setInterval(function () {
				$(\"#content\").load(\"html/encours.html\");
			}, 3000);
 
		});
	";

**hub73** · 30/06/2021, 12h38

Merci beaucoup, çà fonctionne avec cette correction.

Rafraichir HTML dans la page à intervalle donné.

jQuery

Discussions similaires

Partager

Partager