Javascript Показать / Скрыть элементы, почему этот код не работает? - PullRequest
1 голос
/ 01 апреля 2012

Итак, как вы можете видеть, я забавляю javascript для показа / скрытия элементов, однако, когда вы нажимаете .png, он показывает текст, но не скрывает текст другого элемента.Я перебирал этот сценарий снова и снова, и Google черт его искал, и я не могу придумать ответ.Я думаю, что мне нужна другая пара глаз, поэтому, если кто-нибудь взглянет на это, дайте мне знать, если есть ошибки или я пропускаю какой-то код.

<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 Ответ

1 голос
/ 01 апреля 2012
<a href="#" onclick="showStuff('character1');" onclick="hideStuff('character2');">

В этой строке вы сначала устанавливаете свойство onclick на showStuff('character1'), затем переназначаете на hideStuff('character2').

Итак, вы должны объединить эти два вызова функций в одну функцию, а затем назначить эту функцию onclick.

onclick="function() { showStuff('character1'); hideStuff('character2'); }
...