Comment charger une page HTML en Javascript

Résolu

Javascript

Perlogic -
zellfurath Messages postés 200 Date d'inscription Statut Membre Dernière intervention - 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

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

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

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

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

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

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 Statut Membre Dernière intervention 894

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 Statut Membre Dernière intervention 6

peut-être en utilisant un iframe...

Réponse 7 / 11

Perlogic

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

 <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

Merci beaucoup

Utilisateur anonyme

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

Mik

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

Réponse 8 / 11

Utilisateur anonyme

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 Statut Membre Dernière intervention 2

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 Statut Membre Dernière intervention 894

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 Statut Membre Dernière intervention 2

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 -
Dominique49 -

3 réponses

masquer/afficher Div avec CSS sans JS

pijaku -
Debutant en webmastering -

8 réponses

telecharger javascript

tribal88 -
flyblue -

31 réponses

checkbox + onChange

sebounty -
nieuxeur -

7 réponses

formulaire + javascript : verification champs

wallacebarth22 -
Mario Khaled Balotelli -

12 réponses

Prob Javascript bloqué.. URGENT!!!

galaxauguste -
kevinator2025 -

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