Javascript Show/Hide elements, why isn't this code working?
Question
So, as you can see I amusing javascript to show/hide elements, however when you click the .png it shows the text but does not hide the other element's text. I have been going over and over this script and Google searching the hell out of it and I cannot come up with an answer. I think I need another pair of eyes, so if anyone takes a look at this let me know if there are errors or if I'm missing some code.
<html>
<head>
<meta name = "viewport" content = "initial-scale = 1.0, user-scalable = no" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<script type="text/javascript" src="NKit.js"></script>
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript">
function showStuff(id) {
document.getElementById(id).style.display = 'block';
}
function hideStuff(id) {
document.getElementById(id).style.display = 'none';
}
</script>
</head>
<body>
<div class="content">
<section class="left">
<p>
<a href="#" onclick="showStuff('character1');" onclick="hideStuff('character2');"><img src="character1.png" id="char1" /></a>
</p>
<p>
<a href="#" onclick="showStuff('character2');" onclick="hideStuff('character1');"><img src="character2.png" id="char2" /></a>
</p>
</section>
<section class="right">
<span id="character1" style="display: none;">Show character1 information</span>
<span id="character2" style="display: none;">Character 2 information</span>
</section>
</div>
</body>
</html>
1 answers
solution1
1 2012-03-31 21:40:13
<a href="#" onclick="showStuff('character1');" onclick="hideStuff('character2');">
On this line, you first set the property onclick to showStuff('character1') , then you it to hideStuff('character2') . 其为hideStuff('character2') 。
So, you should wrap these two function calls into one function and then assign that function to onclick .
onclick="function() { showStuff('character1'); hideStuff('character2'); }
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.