CODEWITHSUNDEEP
jquerygoogle-chromeimage
user883749
user883749

Reputation: 213

Setting image src attribute not working in Chrome

I want to get the src of one image and set it as another's src when #btn is pressed:

jQuery("#btn").live("click", function() {
    jQuery("#another_div")
        .children("img")
        .attr("src", jQuery(this).prev("img").attr("src"));
    jQuery(this)
        .prev("img")
        .attr("src","");
})

I have also tried:

jQuery(this).prev('img').removeAttr("src");

It works fine in Firefox, IE7-9, and Safari.

Only in Chrome, the image is not removed even when the source changes (src="").

Upvotes: 21

Views: 21477

Answers (7)

Ari Okkonen
Ari Okkonen

Reputation: 165

The following works well with Chrome and does not seem to give any messages to console:

image.src = "about:blank"; // Clear source path

Upvotes: 2

Vlad Sabev
Vlad Sabev

Reputation: 602

This worked for me:

var $image = $('.my-image-selector');
$image.removeAttr('src').replaceWith($image.clone());

However, be wary of any event handlers that you might have attached to the image. There's always the withDataAndEvents and deepWithDataAndEvents options for jQuery clone, but I haven't tested the code with them: http://api.jquery.com/clone/#clone-withDataAndEvents

Also, if you want to do this for multiple images, you will probably have to use something like jQuery each.

I posted an identical answer on a similar question: Clear an IMG with jQuery

Upvotes: 0

Er. Dj
Er. Dj

Reputation: 31

Since in my case by doing this

$(this).attr("src","");

clearing the src attribute, but, image does not vanish. Hence I just set, img tag style attribute display to none, like this

$(this).attr("src","").css("display", "none");

It will hide the image. I hope, it will temporarily work for you.

Upvotes: 3

Terry
Terry

Reputation: 14219

jQuery('#btn').live("click", function() {
    jQuery('#another_div')
        .children("img")
        .attr("src", jQuery(this).prev('img').attr("src"));
    jQuery(this)
        .prev('img').remove();
})

Upvotes: 1

Chamika Sandamal
Chamika Sandamal

Reputation: 24302

try remove image and append it again

jQuery('#another_div').children("img").remove()
jQuery('#another_div').append('<img>').attr("src",jQuery(this).prev('img').attr("src"));

Upvotes: 2

Joseph Marikle
Joseph Marikle

Reputation: 78520

You could change it to

jQuery(this).attr("src", "data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==");

maybe?

Upvotes: 31

Netorica
Netorica

Reputation: 19327

try to set the src first to blank

$(this).attr("src","");

then

$(this).removeAttr("src");

Upvotes: 0

Related Questions