简体   繁体   中英

Change an image on click with Javascript, but still following the link

I have the following html

<a href="email.html" target="_blank" ><img src="../img/mailto.gif" alt="Send email" id='email'/></a>

Clicking the image should open a new window and you should now if that image has been clicked on before, simply because it would change when you click on it. This is also included in a table created with PHP from a MySQL table (basically, this means I will get a new image in every row and I can only change their ID's globally, not one by one..)

After adding this jquery code the link stopped working. Which means that, when I click on the image it changes to a different one (.../img/mailto_onclick.gif) and that's fine, but the email.html page doesnt open in a new tab like it used to...

<script language="javascript">
$(document).ready(function() {
  $('#email').click(function(){
    $(this).attr('src',"../img/mailto_onclick.gif");
       return false;
  });
});
</script>

Any thought's on how to get this working? Sorry if it's some basic or obvious stuff

Try this:

<script language="javascript">
    $(document).ready(function() {
      $('#email').click(function(){

        $(this).attr('src',"../img/mailto_onclick.gif");
           //return false;
      });
    });
    </script>

Remove return false as it will prevent the default behavior for click() because <img> is wrapped inside <a></a> .

 $('#email').click(function(){
    $(this).attr('src',"../img/mailto_onclick.gif");
      // return false; // remove
  });

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.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM