Javascript/htmlの複数のonclickイベント

htmlボタンに複数のonclickイベントを作成するにはどうすればよいですか？私が今持っているコードは、1つのボタンに対してのみ実装しています。他のボタンがクリックされたときに、画像srcを別の画像に変更するにはどうすればよいですか？私は各ボタンごとに異なる機能を使用しようとしましたが、うまくいきませんでした。Javascript/htmlの複数のonclickイベント

<body> 
<button class="button" onclick="myFunction()" ><strong>Objectives</strong></button> 
<button class="button"><strong>Mission</button></strong> 
<button class="button"><strong>Chemistry Vision</strong></button> 
<button class="button"><strong>Environment Vision</strong></button></br> 
<img id="myImg" src="http://image.png" > 
<script> 
function myFunction() { 
    document.getElementById("myImg").src = "http:Objectives.png"; 
} 
</script> 
</body>

出典

2016-12-12 user3049674

があなたのボタンクラスを与え、 'のgetElementsByClassName（）を使用してそれらを選択します;' 。 IDはunqiueでなければならないので、指定したコードは特定のボタンにのみ関連しています。 –

"ボタンごとに異なる機能を使ってみましたが、うまくいきませんでした"。任意の方法で、代わりに引数を指定して同じ関数を呼び出してみてください。例：myFunction（ 'Objectives'）; – leonsaysHi

ボタンごとに異なる機能を試したコードを投稿してみてください。その後、デバッグの助けを得ることができます。 –

あなたは、関数にこのような何かパラメータを渡す必要があります。

<body> 
<button class="button" onclick="myFunction('Objectives')" ><strong>Objectives</strong></button> 
<button class="button" onclick="myFunction('Mission')"><strong>Mission</button></strong> 
<button class="button" onclick="myFunction('Chemistry)"><strong>Chemistry Vision</strong></button> 
<button class="button" onclick="myFunction('Environment')"><strong>Environment Vision</strong></button></br> 
<img id="myImg" src="http://image.png" > 
<script> 
function myFunction(imgName) { 
    document.getElementById("myImg").src = "http:" + imgName + ".png"; 
} 
</script> 
</body>

出典

2016-12-12 15:43:43

ありがとう！ @Whitcik – user3049674

Javascript/htmlの複数のonclickイベント

答えて

関連する問題