0
J'essaie d'obtenir l'en-tête pour basculer entre les mots "Chirurgien Plastique Certifié Conseil, Landon Keith" et "Landon Keith, Chirurgien Plastique Certifié Conseil" mais rien ne se passe et ça ressemble à onload la fonction ne fonctionne pasLa fonction de chargement Javascript ne fonctionne pas
Ex. Lorsque je clique sur l'image, l'en-tête montre "Landon Keith, Chirurgien Plastique Certifié Conseil" et quand je clique à nouveau sur l'image, il faut dire "Chirurgien Plastique Certifié Conseil, Landon Keith" et ainsi de suite.
Mon code est le suivant:
var p = document.getElementById('pic');
var h = document.getElementById('head');
alert("oh");
window.onload=function(){
\t alert("inonload"); // This alert function is not showing up
\t p.onclick = function(){
\t \t if (sessionStorage["clicked"] == "true"){
\t \t \t alert ("if");
\t \t \t sessionStorage["clicked"] = "false";
\t \t \t h.innerHTML = "Board Certified Plastic Surgeon, Landon Keith";
\t \t }else{
\t \t \t alert ("else");
\t \t \t sessionStorage["clicked"] = "true";
\t \t \t h.innerHTML = "Landon Keith, Board Certified Plastic Surgeon";
\t \t }
\t };
};
alert("end");body{
\t margin-bottom: 100px;
\t margin-right: 20px;
\t margin-left: 20px;
\t margin-top: 10px;
\t background-color: green;
\t font-family:Helvetica;
}
.navBar {
\t background-colour: red;
\t
}
#pagewrap {
\t background-color: yellow;
\t height: 280px;
\t width: 640px;
\t margin-left: auto;
\t margin-right: auto;
\t padding-top: 25px;
}
ul {
\t padding-left: 10px;
\t background-color: red;
\t list-style: none;
}
ul li {
\t display: inline;
}
ul li a {
\t text-decoration:none;
\t color:white;
}
img {
\t float: right;
\t padding-right: 20px;
}
h1 {
\t margin-left: 25px;
\t font-size: 14pt;
}
ol {
\t margin-left: 25px;
}
p {
\t margin-left: 25px;
}<!DOCTYPE html>
<html>
<head>
<title>Keith and Company</title>
<link rel="stylesheet" type="text/css" href="css.css">
<script src='js.js'></script>
</head>
<body onload="init()">
\t <div id=pagewrap>
\t \t <img id="pic" src=image.png></img>
\t \t <ul>
\t \t \t <li class="navBarItem"><a href="#3">Reconstructive Surgery</a></li>
\t \t \t <li class="navBarItem"><a href="#4">Cosmetic Surgery</a></li>
\t \t \t <li class="navBarItem"><a href="#5">Awards</a></li>
\t \t \t <li class="navBarItem"><a href="#6">Testimonials</a></li>
\t \t </ul>
\t \t
\t \t <h1 id="head" >Landon Keith, Board Certified Plastic Surgery</h1>
\t \t <ol>
\t \t \t <li> M.D., <a href="#1"> University of SomeState></a></li>
\t \t \t <li> Specialization. <a href="#2"> John Hide></a></li>
\t \t </ol>
\t \t <p>
\t \t \t Keith and Company<BR>
\t \t \t 111 Street Name<BR>
\t \t \t Town, State, Postal Code<BR>
\t \t </p>
\t </div>
\t
</body>
Votre code atteint-il l'alerte de fin? Pouvez-vous également vérifier la console pour voir s'il y a des erreurs? –
Voyez-vous une erreur sur la console? Appuyez sur F12 sur chrome pour voir la console –
Assurez-vous que onload = "init()" écrase window.onload = function() {} – emed