sta*_*ape 3 html javascript onclick button
但是,测试一个简单的切换显示,第一次切换显示需要两次点击.之后它会在一个中完成.
<html>
<head>
<style>
#carousel{border:2px solid blue;
width:1280px;
height:720px;}
#p2{visibility:hidden;}
#p1{display:block;}
#btn{position:absolute;
top:2000px;}
</style>
<script src="mainScript.js"></script>
</head>
<body>
<div id="carousel">
<img id="p1" src="pic1.jpg">
<img id="p2" src="pic2.jpg">
</div>
<button type="button" id="button" onclick="clickEvent()">Click</button>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
这是我的javascript:
function clickEvent(){
var p = document.getElementById("p1");
if(p.style.display == "block")
p.style.display = "none";
else
p.style.display = "block";
}
Run Code Online (Sandbox Code Playgroud)
应该注意我没有使用jQuery,因为我发现的所有其他问题都与jQuery有关.
function clickEvent(){
var p = document.getElementById("p1");
if(p.style.display == "none")
p.style.display = "block";
else
p.style.display = "none";
}
Run Code Online (Sandbox Code Playgroud)
你也可以简化一下事情:
p.style.display = p.style.display == "none" ? "block" : "none";
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
5880 次 |
| 最近记录: |