Comment charger une page HTML en Javascript

Résolu

Javascript

Perlogic - 28 août 2008 à 16:04
zellfurath Messages postés 200 Date d'inscription jeudi 29 novembre 2007 Statut Membre Dernière intervention 27 novembre 2015 - 30 janv. 2014 à 08:33

Bonjour,

J,ai une page HTML contruit à l'aide de deux DIV. Les DIV sont placer l'un en dessous de l'autre.

par exemple:

<DIV id="f_1">
et
<DIV id="f_2">

Sur une action ONCLICK j'appel une fonction Javascript que j'ai créé, cette fonction doit charger une page HTML qui est sur mon disque dur. Mais mon problème est que je ne saisp as comment charger cette page pour l'afficher mon dans le DIV f_2.

Avez-vous une idée pour comment faire?

Merci beaucoup

Perlogic

Afficher la suite

Répondre (11) Posez votre question

Répondre (11)

A voir également:

Appeler un fichier javascript dans une page html
Fichier bin - Guide
Comment réduire la taille d'un fichier - Guide
Comment ouvrir un fichier epub ? - Guide
Supprimer une page dans word - Guide
Fichier rar - Guide

11 réponses

Réponse 1 / 11

Meilleure réponse

La meilleure réponse est la réponse qui a été validée par nos équipes.

Perlogic
29 août 2008 à 17:26

Yes, j'ai trouvé une astuce.

 <html>
	 <head>
		 <script language="JavaScript" type="text/javascript">
			function loadPage(url){
				document.getElementById('if').contentWindow.document.location.href=url;
			}
		 </script>
	 </head>
	 <body>
		 <div id="f_1">
			<button onclick="javascript:loadPage('http://www.google.be');">Cliquer pour charger la Div ci-dessous</button>
		 </div>
                                 <div id="clear" width="640" height="480"></div>
		 <div id="f_2">
			<iframe id="if" width="640" height="480">
			</iframe>
		 </div>
		 </div>
		 </div>
	 </body>
 </html>

Perlogic

Réponse 2 / 11

anonyme
26 janv. 2011 à 16:32

Bonjour,

J'ai pas lu la discussion entièrement (pardonnnez!) mais moi pour charger une page à partir d'un boutonj'utilise le code suivant:
<INPUT TYPE="button" VALUE="clic Google" onclick="javascript:window.location.replace('http://www.google.be');" >

Réponse 3 / 11

Perlogic
29 août 2008 à 19:28

Une première fois pour lire mon fichier HTML il n'y a pas de problème. Et charger un autre fichier dans le même iframe cause un problème d'accès .

J'ai pensé metre un DIV sur la région avant de refaire mon iframe, mais ça n'a pas fonctionné. Le code de HackTrack fonctione, mais si le bouton est utilisé plus d'une fois, ça ne fonctionne plus.

Es-t'il possible de retirer le iframe pour libérer l'espace pour en mettre un autre?

Merci

Perlogic

tanahe
19 janv. 2009 à 07:16

salutation (surement un peu tard :s)

le code de Hacktrack etait bon
je l'ai juste un peu modif..
es ce ca que tu cherches ?

<html>
<head>
<script language="JavaScript" type="text/javascript">
function loadPage(url){
document.getElementById('f_2').innerHTML = '<iframe src="' + url + '" width="640" height="480"></iframe>';
}
</script>
</head>
<body>
<div id="f_1">
<button onclick="javascript:loadPage('http://www.google.be');">Cliquer pour charger la Div ci-dessous be</button>
<button onclick="javascript:loadPage('http://www.google.fr');">Cliquer pour charger la Div ci-dessous fr</button>
<button onclick="javascript:loadPage('http://www.google.de');">Cliquer pour charger la Div ci-dessous de</button>
</div>
<div id="f_2"></div>
</div>
</div>
</body>
</html>

avec ce code et quelque ligne plus, il est meme possible avec de choisir un autre div pour destination
@+

Réponse 4 / 11

Perlogic
29 août 2008 à 16:04

Bonjour,

Super la ce que HackTrack a écrit, mais j'obtient un problèeme d'accèes si je clique dessus plus d'une fois. Ceci me pose un problème car dans mon premier DIV sera mon menu, puis le second DIV sera mes différente pages choisie ou par des hyperliens.

Mon menu lancera des pages HTML dans le IFRAME, mais il semble que je ne peux pas ouvrir deux IFRAME sur l'un sur l'autre. D'où le problèeme du bouton, je ne peux le cliquier qu'une seule fois.

Il y a t-il une astuce?

Merci

Perlogic

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 11

Perlogic
29 août 2008 à 17:57

Ha non!

J'ai pas résolu mon problème d'accès refusé

Avez-vous une idée?

Merci

Perlogic

Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
29 août 2008 à 18:07

cette fonction doit charger une page HTML qui est sur mon disque dur

Je ne pense pas que Javascript puisse accéder à ton disque dur, heureusement ! car brrrrrr la sécurité

Un site mal intentionné viendrait lire dans ton DD et recupérerait ça

Réponse 6 / 11

[CPC] GROquiK Messages postés 61 Date d'inscription jeudi 28 août 2008 Statut Membre Dernière intervention 31 mai 2009 6
28 août 2008 à 16:08

peut-être en utilisant un iframe...

Réponse 7 / 11

Perlogic
28 août 2008 à 16:59

Bonjour,

un IFRAME ne fonctionne pas, voici ce que j'ai essayer dans mon javascript:

document.write("<IFRAME src='page3.html' width=100% height=97% scrolling=auto frameborder=0 > </IFRAME>")

Le problèeme est que je ne peux lui dire dans quel ID l'envoyer ou dans quel CSS, la clause Class n'existe pas.

      IFRAME= (frame flottant) HTML 
Définition Définit un frame flottant 3.2 4.0 
Syntaxe <IFRAME> ... </IFRAME>
IFRAME est un élément fermé.     
Attributs spécifiques 
  Align Aligne un frame flottant à gauche, au centre ou à droite de l'écran.     
  Name Attribue un nom au frame flottant     
  Noresize Précise au navigateur que l'utilisateur ne peut modifier la taille du frame. Attribut sans paramètre.     
  SRC Définit le document source et son adresse      
  Width Permet de définir la largeur de la fenêtre ouverte.     
  Height Définit la hauteur de la fenêtre ouverte.     
  Frameborder Permet d'afficher ou non la bordure du frame.     
  Scrolling Autorise ou interdit l'affichage des ascenseurs sur les côtés du frame.     
  Marginwidth Permet de définir un espace horizontal entre la bordure du frame et la bordure du document.     
  Marginheight Permet de définir un espace vertical entre la bordure du frame et le bordure du document.     
  Hspace Détermine l'espace entre texte et frame sur les côtés verticaux.      
  Vspace Détermine l'espace entre texte et frame sur les bords horizontaux.

Utilisateur anonyme
29 août 2008 à 14:29

 <html>
	 <head>
		 <script language="JavaScript" type="text/javascript">
			function loadPage(url){
				document.getElementById('if').contentWindow.document.location.href=url;
			}
		 </script>
	 </head>
	 <body>
		 <div id="f_1">
			<button onclick="javascript:loadPage('http://www.google.be');">Cliquer pour charger la Div ci-dessous</button>
		 </div>
		 <div id="f_2">
			<iframe id="if" width="640" height="480">
			</iframe>
		 </div>
		 </div>
		 </div>
	 </body>
 </html>

;-)
HackTrack

toutgreg > Utilisateur anonyme
21 nov. 2009 à 12:52

Merci beaucoup

Utilisateur anonyme
28 févr. 2011 à 18:58

Fermer TROIS </div> quand UNE SEULE est ouverte ? ? ?

Mik
20 oct. 2011 à 04:29

exact, y pue tight avec ses 3 </div>...

Réponse 8 / 11

Utilisateur anonyme
Modifié par Yvanoph le 28/02/2011 à 18:45

Bonjour / Bonsoir,

Pour charger quoi que ce soit dans une Frame/IFrame, il FAUT tout d'abord lui donner un NOM, soit l'attribut name=zone_1 par exemple, PUIS par chaque bouton correspondant CIBLER la Frame/IFrame par son NOM !

Exemple :
document.write("<IFRAME src='page3.html' name=zone_1 width=100% height=97% scrolling=auto frameborder=0 > </IFRAME>")

Ensuite, il y a trois manières d'accéder à une Frame/IFframe :

* Avec le nom
* Avec l'objet global frames
* Avec l'id

Ne PAS prendre id, qu'il est effectivement possible d'utiliser tout comme name ou l'objet global supporté par tous les navigateurs MAIS qu'Ie refuse...

Voici donc les deux techniques en action :

var oFrame = window.zone_1; // Avec le name
var oFrame = window.frames["zone_1"]; // Avec l'objet global

Une fois l'iframe atteinte, on peut accéder à son contenu, avec l'objet document :

var oFrame = window.zone_1.document; // Avec le name
var oFrame = window.frames["zone_1"].document; // Avec l'objet global

Pour changer le contenu, rien de plus simple par src :

Bouton 1 lance,
document.getElementById('zone_1').src = "autreFichier1.html";
Bouton 2 lance,
document.getElementById('zone_1').src = "autreFichier2.html";
etc.

Mais RAPPEL, par ID problème avec Ie

Sinon :

Bouton 1 lance,
<A HREF="autreFichier1.htm" TARGET="zone_1">
Bouton 2 lance,
<A HREF="autreFichier2.htm" TARGET="zone_1">
etc.

Cordialement, Yvanoph---

Réponse 9 / 11

zellfurath Messages postés 200 Date d'inscription jeudi 29 novembre 2007 Statut Membre Dernière intervention 27 novembre 2015 2
29 janv. 2014 à 09:27

bonjour,

et j'aimerai savoir comment peut-on remplacer le bouton de ce script par une image avec effet javascript svp ?

j'ai tous ces codes et je n y arrive pas.. c'est a partir d'un template de menu javascript..

<a class="dock-item2" href="#"><img src="images/bt_06.png" alt="history" /></a>

<button onclick="javascript:loadPage('http://www.google.de');">Cliquer pour charger la Div ci-dessous de</button>

je n'arrive pas a combiner ça :)

merci d'avance pour vos réponses.

Réponse 10 / 11

Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
Modifié par Alain_42 le 29/01/2014 à 13:43

Salut, essayes comme ça:

<a class="dock-item2" href="javascript:loadPage('http://www.google.de');"><img src="images/bt_06.png" alt="Cliquer pour charger la Div ci-dessous de" /></a>

si j'ai bien compris ton pb et que tu as une fonction loadPage
pour les effets que tu souhaites

Réponse 11 / 11

zellfurath Messages postés 200 Date d'inscription jeudi 29 novembre 2007 Statut Membre Dernière intervention 27 novembre 2015 2
30 janv. 2014 à 08:33

c est a peu pret ce que j'ai fais finallement. tu ma bien conseillé !
au final je n'affiche que du texte.. c est ce que je voulais.
j ai fais des containers dans des div c est ultra basic en fet :)

Répondre Posez votre question

Votre réponse

Discussions similaires

Isset en Javascript

arezius - 11 sept. 2008 à 10:56
Dominique49 - 1 févr. 2011 à 11:00

3 réponses

masquer/afficher Div avec CSS sans JS

pijaku - 22 juil. 2008 à 12:11
Debutant en webmastering - 9 mai 2012 à 00:27

8 réponses

telecharger javascript

tribal88 - 5 oct. 2008 à 16:56
flyblue - 12 avril 2015 à 10:35

31 réponses

checkbox + onChange

sebounty - 15 juil. 2008 à 15:50
nieuxeur - 23 nov. 2010 à 01:18

7 réponses

formulaire + javascript : verification champs

wallacebarth22 - 15 juil. 2008 à 14:29
Mario Khaled Balotelli - 20 mai 2012 à 11:14

12 réponses

Prob Javascript bloqué.. URGENT!!!

galaxauguste - 5 juil. 2008 à 16:55
kevinator2025 - 28 août 2013 à 21:23

49 réponses

Devenez membre en quelques clics

Connectez-vous simplement avec ceux qui partagent vos intérêts
Suivez vos discussions facilement et obtenez plus de réponses
Mettez en avant votre expertise et aidez les autres membres
Profitez de nombreuses fonctionnalités supplémentaires en vous inscrivant

S'inscrire