Créer un bouton hyperlien

Signaler
Messages postés
22
Date d'inscription
lundi 4 décembre 2017
Statut
Membre
Dernière intervention
27 février 2020
-
jordane45
Messages postés
27710
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
28 février 2020
-
bonjour , j'aimerais savoir comment mettre un lien à un bouton javascript ?
J'ai déjà ce truc en HTML mais je ne sais pas quoi mettre dans mon script de JS.
<button onclick="foncRevenir()">Revenir à l'accueil</button>

8 réponses

Messages postés
27710
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
28 février 2020
2 148
Bonjour,
https://www.w3schools.com/howto/howto_js_redirect_webpage.asp

// Simulate a mouse click:
window.location.href = "http://www.w3schools.com";

// Simulate an HTTP redirect:
window.location.replace("http://www.w3schools.com")

Messages postés
27710
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
28 février 2020
2 148
Je ne t'avais pas demandé pour la console... un oubli de ma part.. désolé.

Par contre.. tu as encore des noms de fichiers avec des espaces...

Quoi qu'il en soit, tu as des erreurs dans ton code html.
Des bouts de codes placés à de mauvais endroits...

Essayes ceci :
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Projet HTML</title>
    <link href="style2.css" rel= "stylesheet" media="screen"/>
  </head>
  <body>
    <h1>HTML</h1>
    <h2>Bienvenue sur la page de révision du langage HTML. Vous trouverez une question sur le HTML.</h2>
    <p>Question : A quoi sert le langage HTML ?</p>
    <div onmouseover="foncEntre();" onmouseout="foncQuitte()" id="maDiv">
           <p>Pour coder une page WEB.</p>
    </div>
    <div onmouseover="foncEntr();" onmouseout="foncQuitt();" id="maDiv1">
       <p>Pour coder un logiciel de comptabilité.</p>
     </div>
    <button onclick="foncAccueil()">Revenir à l'accueil</button>
    <script src="script1.js"></script>
  </body>
</html>

Testé... et fonctionnel...




Messages postés
22
Date d'inscription
lundi 4 décembre 2017
Statut
Membre
Dernière intervention
27 février 2020

Merci pour ton aide mais lorsque que je tape ceci dans mon fichier .js
window.location.href="projet revision nsi accueil.html";
et que j'ouvre ma page ça me dit fichier introuvable et qu'il est peut-être déplacé. Quand je supprime cette ligne de code ça refonctionne , j'ai mon bouton mais lorsque je clique j'ai toujours pas de lien vu que j'ai supp la ligne de code. Meme avec
function foncAccueil(){
window.location.href="projet revision nsi accueil.html";
}
marche pas

ps: j'ai changé le nom de la fonction en
foncAccueil
Messages postés
22
Date d'inscription
lundi 4 décembre 2017
Statut
Membre
Dernière intervention
27 février 2020

Messages postés
27710
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
28 février 2020
2 148
Déjà on évite d'avoir des caractères spéciaux ou des espaces dans des fichiers utilisés pour le web.
Ensuite, passes tu par un serveur web ou es tu seulement en local sur ton ordi ?
Quelle est l'url du fichier dans lequel tu places ce code ?
Le fichier que tu cherches à ouvrir se trouve t'il dans le même dossier ?
Quelle est l'url qui apparait une fois que tu as cliqué sur le bouton ?
Messages postés
22
Date d'inscription
lundi 4 décembre 2017
Statut
Membre
Dernière intervention
27 février 2020

Bonjour,
le nom du dossier est "Eddy_Mathis_Abdel".
Ensuite j'ai ajouté des "_" underscores à la place des espaces .
Je travaille sur un fichier local sur clé usb et l'url est file:///E:/NSI/Eddy_Mathis_Abdel/projet_revision_nsi_accueil.html

Tout les fichiers sont bien dans le même dossier.

J'ai en premier temps tapé
<button onclick="foncAccueil()">Revenir à l'accueil</button>
dans un fichier .html et dans un second temps j'ai tapé
function foncAccueil(){
window.location.href = "projet_revision_nsi_accueil.html"
}
dans un fichier en .js

Je ne vois aucun problème mais le bug persiste . Merci de m'aider ça serai adorable sachant que je dois l'envoyer à ma Prof demain soir au plus tard.

Merci Jordane :D
jordane45
Messages postés
27710
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
28 février 2020
2 148
Tu dis avoir placé le code dans un fichier js... et comment le charges tu dans ta page ?
Comment se nomme le fichier dans lequel tu as placé ton bouton ?
Quel code ( complet) s'y trouve ?
Le fichier se trouve t'il dans le même dossier que ton fichier accueil ?
As tu ouvert la console de ton navigateur pour voir si il y avait des erreurs de script tel que je te l'ai demandé ?
Messages postés
22
Date d'inscription
lundi 4 décembre 2017
Statut
Membre
Dernière intervention
27 février 2020

Le fichier dans lequel est placé mon bouton se nomme "projet revision nsi page html.html" .
<html>
<title>Projet HTML</title>
<head>

<link href="style2.css" rel= "stylesheet" media="screen"/>
</head>
<body>


<h1>HTML</h1>

<h2>Bienvenue sur la page de révision du langage HTML. Vous trouverez une question sur le HTML.</h2>

<p>Question : A quoi sert le langage HTML ?</p>

<div onmouseover="foncEntre()" onmouseout="foncQuitte()" id="maDiv"><p>Pour coder une page WEB.</p></div>
<div onmouseover="foncEntr()" onmouseout="foncQuitt()" id="maDiv1"><p>Pour coder un logiciel de comptabilité.</p></div>

<button onclick="foncAccueil()">Revenir à l'accueil</button>

</body>
<script src="script1.js"></script>
</html>


La fonction se trouve dans "script1.js" .
alert("Si la réponse que vous survolez est verte, c'est la bonne réponse. Sinon, le rouge indique la mauvaise réponse")

function foncEntre(){
document.querySelector("#maDiv").classList.remove("bleu");
document.querySelector("#maDiv").classList.add("vert");
}

function foncQuitte(){
document.querySelector("#maDiv").classList.remove("vert");
document.querySelector("#maDiv").classList.add("bleu");
}

function foncEntr(){
document.querySelector("#maDiv1").classList.remove("bleu");
document.querySelector("#maDiv1").classList.add("rouge");
}

function foncQuitt(){
document.querySelector("#maDiv1").classList.remove("rouge");
document.querySelector("#maDiv1").classList.add("bleu");
}

function foncAccueil(){
window.location.href = "projet_revision_nsi_accueil.html"
}


Oui tout les fichiers sont au même endroit et non je ne pense pas que tu m'ai demandé d'ouvrir la console mais je vais le faire ducoup.
Mais comment je fais sur mozilla (j'ai fais "f12") et après je fais quoi ???
Messages postés
22
Date d'inscription
lundi 4 décembre 2017
Statut
Membre
Dernière intervention
27 février 2020

Merci pour ton aide mais je ne sais pas ça marche toujours pas , ce n'est pas grave je vais faire qq chose d'autre. Merci de m'avoir accordé du temps : )
jordane45
Messages postés
27710
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
28 février 2020
2 148
Pense à vider le cache de ton navigateur ( à faire lorsqu'on modifie du code JS ou CSS sur une page web )
Pense également à ouvrir la console de ton navigateur pour détecter d'éventuelles erreurs de script
Vérifie également que le nom de tes fichiers est bien strictement le même que celui utilisé dans ton code ( les majuscules/minuscules ont leur importance).

Pour finir, places le contenu de ton site dans un dossier de ton disque dur et teste le....
Si ça fonctionne depuis cet emplacement.. c'est que le souci vient du support utilisé.