View Full Version : Two Second onClick Problem

03-12-2012, 10:04 PM
Hello Everyone! I have one link that I need to do two onclick events at once. At first I just tried writing them both but that obviously didn't work b/c I'm here! This would result in the first onclick event tacking place and not the second. So my question is could someone tell me how to write this code in javascript, so both events will take plack onclick, and then how I should reference that script within my link? Thank you for taking a look

<a href = "javascript:void(0)"

onclick = "document.getElementById('light<?php echo $count;?>').style.display='none';document.getElementById('fade<?php echo $count;?>').style.display='none'"

onclick = "document.getElementById('light<?php echo $count + 1;?>').style.display='block';document.getElementById('fade<?php echo $count + 1;?>').style.display='block'"> Previous


03-12-2012, 10:07 PM
get rid of the " onclick=" in the middle of the onclick so that all the JavaScrip t is inside of the first one. The last onclick overwrites any previously attached.

Alternatively update your code into the 21st century and use event listeners in an external JavaScript file instead of event handlers in the HTML. With event listeners you can attach multiple listeners to the same event on the same element whereas with event handlers there can be only one.

03-12-2012, 10:18 PM
Got it working! Thank You!

03-14-2012, 06:00 AM
I don't want to be that guy who starts a new thread for a similair problem so I thought I'd ask for additional help here. I currently have two onclick events for when a user clicks a Previous arrow to go to the previous lightbox but is it also possible to add another event that would carry out the same function if they clicked the left arrow key on their keyboard? In other words let users scan through images similair to facebook with just their arrow keys. Thank you for reading.

<a href = "javascript:void(0)" onclick =
"document.getElementById('show<?php echo $count;?>').style.display='none';
document.getElementById('hide<?php echo $count;?>').style.display='none'

document.getElementById('show<?php echo $count - 1;?>').style.display='block';
document.getElementById('hide<?php echo $count - 1;?>').style.display='block'">

<?php echo "<<<"; ?>


03-14-2012, 06:03 AM
If it helps I found this article http://www.javascriptkit.com/jsref/eventkeyboardmouse.shtml which seems to be what I am looking for but I am not sure how to use it in my code! thanks again