javascript - JSJQuery Retry Img Load After 1 Second - Stack Overflow

admin管理员组

文章数量:1287523

I have a request calling up a bunch of images like so:

<a href='www.domain1'><img src='../image/img1.png' onerror='imgError(this);'/></a>
<a href='www.domain2'><img src='../image/img2.png' onerror='imgError(this);'/></a>

The problem is when the call is made some of the images (~20%) are not ready yet. They need another second.

So in js or jquery what I would like to do is on error get the images that failed, wait 1 second, then try to load those failed images again. If they fail on the 2nd try -- oh well, Im okay with that. But Im not doing this correctly... Should I not be calling a timeout inside of another method in js?

function imgError(image) {
    image.onerror = "";
    image.src = image;

    setTimeout(function () {
        return true;
    }, 1000);
}

I have a request calling up a bunch of images like so:

<a href='www.domain1.'><img src='../image/img1.png' onerror='imgError(this);'/></a>
<a href='www.domain2.'><img src='../image/img2.png' onerror='imgError(this);'/></a>

The problem is when the call is made some of the images (~20%) are not ready yet. They need another second.

So in js or jquery what I would like to do is on error get the images that failed, wait 1 second, then try to load those failed images again. If they fail on the 2nd try -- oh well, Im okay with that. But Im not doing this correctly... Should I not be calling a timeout inside of another method in js?

function imgError(image) {
    image.onerror = "";
    image.src = image;

    setTimeout(function () {
        return true;
    }, 1000);
}

• javascript
• jquery

Share Improve this question Follow edited Oct 30, 2013 at 4:56 Samuel O'Malley 3,55111 gold badge2525 silver badges4242 bronze badges asked Oct 30, 2013 at 3:23 ChrisChris 18.9k1515 gold badges6161 silver badges7979 bronze badges 6

• Why in the world do you want to do this? Besides the issues in your implementation, I suspect that setting img.src to what it's already set doesn't do anything. – jfriend00 Commented Oct 30, 2013 at 3:26
• Haha. Well. Im actually using imagemajick in between the initial ajax and loading the images. What is the better practice for something like this? Thank u btw 4 the ment... – Chris Commented Oct 30, 2013 at 3:28
• 1 Check out this answer here: stackoverflow./questions/4285042/can-jquery-ajax-load-image – Samuel O'Malley Commented Oct 30, 2013 at 3:28
• FYI, @SamuelO'Malley, though the OP mentions AJAX, I believe there is no AJAX here, or needing to be here. – Paul Draper Commented Oct 30, 2013 at 4:31
• Thanks @PaulDraper, I wasn't sure if he actually wanted to use AJAX or not. – Samuel O'Malley Commented Oct 30, 2013 at 4:50

 |  Show 1 more ment

1 Answer 1

Sorted by: Reset to default 12

Add a cache breaker.

function imgError(image) {
    image.onerror = null;
    setTimeout(function (){
        image.src += '?' + +new Date;
     }, 1000);
}

(This assumes your image URL doesn't already have a query string, per the example. If it does, a little more work is obviously required.)

本文标签： javascriptJSJQuery Retry Img Load After 1 SecondStack Overflow