how to use jquery variables in html

Question

I am using jquery and what I want to do here is to be able to set the image that will show up based upon the link that is being hovered to.

<script type='text/javascript'>
$(function(){
  $('img').hide();
  $('a').mouseenter(function(){
    var currentimg= $(this).html();
    alert(currentimg);
    $("img[src=currentimg.jpg]").show(); //I want to use currentimg variable here for the name of the jpg file
  });

  $('a').mouseleave(function(){
    $('img').hide();
  });
});
</script>

Nick Craver · Accepted Answer · 2010-12-24 10:40:09Z

6

You can just concatenate the string for use, for example:

$("img[src='" + currentimg +"']").show();

Just to note, there's also a .hover() shortcut for .mouseenter(handler).mouseleave(handler), like this:

$(function(){
  $('img').hide();
  $('a').hover(function(){
     var currentimg = $(this).html();
     $("img[src='" + currentimg +"']").show();
  }, function(){
     $('img').hide();
  });
});

answered Dec 24, 2010 at 10:40

Nick Craver

631k138 gold badges1.3k silver badges1.2k bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

how to use jquery variables in html

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related