How, using jQuery, might I obtain the src attribute of a HTML img element?

Question

When the mouse cursor moves over an image, I would like to display an alert() containing the value of that image's src attribute. How could I go about accomplishing this?

Answer 1

JavaScript:

function alertSource( image ) {
   alert( image.src );
}

HTML:

<img src="path/to/image" onmouseover="alertSource(this);" alt=""/>

You do not need jQuery for this.

Answer 2

You can use the mouseover event.

If you have

<img src='foo.jpg' id='bar'>

You can have some jQuery code like

$('#bar').mouseover(function(){ alert($(this).attr('src')); });

(if this fails you could also try replacing $(this) with $('#bar'), but as noted in the comments it's pretty ugly)

edit: missed the need to display the src attribute first time through..

Answer 3

<img src="some_img.gif">
<script>
$("img").bind("mouseover",function(){
alert($(this).attr("src"));
});
</script>

Answer 4

$('img').mouseover(function() { 
    alert( this.src );
});