Geek asks and answers

Jquery delete image

My common problem is lazy loading images. I got to the point that I upload images only when they are on the screen. I need to delete images that do not appear on the screen.

I thought that

$(image).removeAttr("src")

will do this and it will remove src correctly, but will not clear the screen image and will not replace it with what is in alt.

How do I delete an image? Please note: I do not want to remove the img tag (I need it later), just clear the image from the screen.

Another code that may be relevant (although why I don't know) is

updateCarImages:=>
    imagesOnScreen = $(@el).find(".carImageClass:onScreen")
    imagesOffScreen = _.without(cachedImagesOnScreen,imagesOnScreen)
    for image in imagesOnScreen
      imgSrc = $(image).attr("src")
      if (!imgSrc)
        id = $(image).data("tooltip-id")
        console.log(id)
        result = resultsStore.get(id+"")
        console.log(result)
        $(image).attr("src", result.get("carImageUrl"))
    console.log(imagesOffScreen)
    for image in imagesOffScreen
      $(image).removeAttr("src")
+5
source share
6 answers

If you are trying to clear the memory (which, as I see it, will be the only reason for deleting images that are not visible), you can go for a drive.

. , , - , , .

:

var $trash = $('<div>').hide().appendTo('body');

var waste = function(node) {
    $trash.append(node).html('');
}

GIF:

$(image).attr('src','data:image/gif;base64,R0lGODlhAQABAPABAP///wAAACH5BAEKAAAA‌​LAAAAAABAAEAAAICRAEAOw%3D%3D');

node / .

, , .

iOS iPad ( 4.x) , , IMG.

+4

, jQuery . .

http://www.appelsiini.net/2012/lazyload-170

, , src data-* src, .

:

$(image).data("src", $(image).attr("src"));
$(image).removeAttr("src");
$(image).hide();

:

$(image).attr("src", $(image).data("src"));
$(image).show();
+3

:

$(image).hide();

style="display:none;"

:

$(image).remove();

DOM,

( DOM )

//Remove the SRC and hide the image
$(image).removeAttr("src").hide();

//Then when you want to change to a new image
$(image).attr("src", "iamge.gif").show();
+2

. , 1px-, :

$(image).attr('src', '1px.png');
+1

If you want to hide the image, but keep it in place in terms of taking its place and not affecting the scrollbars of the container, use the style visibility: hidden:

$(image).css('visibility', 'hidden');
+1
source

You can simply remove the image from this code. I have tried this.

$('.img2').dblclick(function()
{
    $(".img2").removeAttr('src');
});
0
source

More articles:


All Articles