我试图让标题在“委员会认证的整形外科医生,Landon Keith”和“Landon Keith,委员会认证的整形外科医生”之间切换,但没有任何反应,看起来像 onload
函数未运行
例如。当我单击图像时,标题显示“Landon Keith,委员会认证的整形外科医生”,当我再次单击图像时,它应该显示“委员会认证的整形外科医生,Landon Keith”等等。
我的代码如下:
var p = document.getElementById('pic');
var h = document.getElementById('head');
alert("oh");
window.onload=function(){
alert("inonload"); // This alert function is not showing up
p.onclick = function(){
if (sessionStorage["clicked"] == "true"){
alert ("if");
sessionStorage["clicked"] = "false";
h.innerHTML = "Board Certified Plastic Surgeon, Landon Keith";
}else{
alert ("else");
sessionStorage["clicked"] = "true";
h.innerHTML = "Landon Keith, Board Certified Plastic Surgeon";
}
};
};
alert("end");
body{
margin-bottom: 100px;
margin-right: 20px;
margin-left: 20px;
margin-top: 10px;
background-color: green;
font-family:Helvetica;
}
.navBar {
background-colour: red;
}
#pagewrap {
background-color: yellow;
height: 280px;
width: 640px;
margin-left: auto;
margin-right: auto;
padding-top: 25px;
}
ul {
padding-left: 10px;
background-color: red;
list-style: none;
}
ul li {
display: inline;
}
ul li a {
text-decoration:none;
color:white;
}
img {
float: right;
padding-right: 20px;
}
h1 {
margin-left: 25px;
font-size: 14pt;
}
ol {
margin-left: 25px;
}
p {
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()">
<div id=pagewrap>
<img id="pic" src=image.png></img>
<ul>
<li class="navBarItem"><a href="#3">Reconstructive Surgery</a></li>
<li class="navBarItem"><a href="#4">Cosmetic Surgery</a></li>
<li class="navBarItem"><a href="#5">Awards</a></li>
<li class="navBarItem"><a href="#6">Testimonials</a></li>
</ul>
<h1 id="head" >Landon Keith, Board Certified Plastic Surgery</h1>
<ol>
<li> M.D., <a href="#1"> University of SomeState></a></li>
<li> Specialization. <a href="#2"> John Hide></a></li>
</ol>
<p>
Keith and Company<BR>
111 Street Name<BR>
Town, State, Postal Code<BR>
</p>
</div>
</body>
最佳答案
body
元素上的内联 onload
处理程序正在覆盖 JavaScript 文件(之前加载的)中的 onload
。从 body
标记中删除 onload=init()
,您的外部代码将会运行。
关于Javascript onload 函数未运行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43379158/