Обратный адрес изображения или ошибки, если она не существует - PullRequest
0 голосов
/ 11 мая 2011

РЕДАКТИРОВАТЬ: я знаю, что моя проблема в том, что я не могу проверить, хорошо ли изображение, пока не успеет загрузить.Я пытаюсь проверить ширину и вернуться после нее или изменения src (используя onerror для установки src.) Я всегда застреваю с условием гонки, и он выдает ошибку задолго до изменения высоты и ширины или src.Когда я перезагружаюсь, изображение кэшируется и работает нормально.Я не знаю, как этого избежать.Вот мой текущий код (также не работает, он зацикливается, пока Firefox не жалуется.) Я устанавливаю возвращение этой функции переменной.Там есть некоторые записи, которые я использую, чтобы увидеть, как далеко он заходит, и он останавливается в цикле while.Я попытался использовать getTimeout ('tstit = chkload ("thisisatest", tinypth);', 250); но это тоже не сработало.Я хотел бы заставить это загрузить по порядку ...

function buildimg(tehname,myc,pth1,pth2,tinypth)
{
var myimg = pth1+tehname+"/"+tehname+"-"+myc+".jpg";
buildtest("thisisatest",myimg,tinypth);
var testimg = document.getElementById("thisisatest");
var tstit = chkload("thisisatest",tinypth);
while(tstit == false) {
      document.write(tstit);
      tstit = chkload("thisisatest",tinypth);
    }
alert(testimg.src+'-'+testimg.width+'-'+testimg.height);
if((testimage.width > 20) && (testimage.height > 20)) {
       return myimg;
    }
else if(typeof pth2 == "undefined") {
        myimg = "error";
        return myimg;
    }
else {
        myimg = buildimg(tehname,myc,pth2);
        return myimg;
    }

document.write('No return error in buildimg.');
return "error";
}

/*Builds a hidden img tag for testing images*/
function buildtest(itsid,itssrc,tinypath) {

 if(document.getElementById(itsid)) {
    var imgobj = document.getElementById(itsid);
    imgobj.remove();
    }
document.write('<img id="'+itsid+'" style="display: none;" src="'+itssrc+'" onerror="swaponerr(\''+itsid+'\',\''+tinypath+'\')"  />');
}

/*Swaps the image to a small picture, so we can detect if it worked*/
function swaponerr(tagid, tinypath) {
    var theimg = document.getElementById(tagid);
    theimg.onerror = '';
    theimg.src = tinypath;
}

/*Recurses to return when the image is loaded*/
function chkload(loadid,tinychk) {
var tehobj = document.getElementById(loadid);
document.write(tehobj.width+'x'+tehobj.height+'x'+tehobj.src);
if((tehobj.naturalWidth > 20) && (tehobj.naturalHeight > 20)) {
    return true;
    }
if(tehobj.src == tinychk) {
    return true;
    }
return false;
}

Мне нужно проверить изображение и вернуть ошибку, если она не существует.Приведенный ниже код отлично работает на моем сервере:

/*Checks if the image at /tehname/tehname-c.jpg exists in either of the paths
outputs it's address if it does, and "error" if not.*/
function buildimg(tehname,index,pth1,pth2)
{
var myimg = pth1+tehname+"/"+tehname+"-"+index+".jpg";
$.ajax({
url:myimg,
type:'HEAD',
error: function()
{
    myimg=pth2+tehname+"/"+tehname+"-"+index+".jpg";     
    $.ajax({
        url:myimg,
        type:'HEAD',
        error: function()
            {
            myimg="error";
            return;
        },
    });     
    return;
},
});
return myimg;
}

К сожалению, я пытаюсь сделать это в испорченной системе, которую использует моя работа.У нас есть jquery, но система хранит пользовательские файлы на отдельном сервере от кода, поэтому ajax не будет работать.Надеюсь, это будет в конечном итоге в файле .js.

Теперь у меня есть код, начинающийся с:

function buildimg(tehname,myc,pth1,pth2)
{
  var myimg = pth1+tehname+"/"+tehname+"-"+myc+".jpg";
  var tehimage = new Image();
  tehimg.src = myimg;

Я попытался заставить функцию загрузить изображение и проверить егоширина, но я всегда получаю 0, так как я не могу предварительно загрузить изображения, не зная, сколько их (и я не хочу иметь какое-то возмутительно большое количество запросов с большинством ошибок). По какой-то причине (впо крайней мере, на ff4, так как моя цель - начать работать в первую очередь) tehimage.complete всегда возвращает false.Я попытался использовать onerror и onload с помощью глобальной переменной и несколько других методов.Должен признать, что я не очень разбираюсь в javascript, поэтому мои обратные вызовы могут не сработать.

Пожалуйста, помогите, я впадаю в отчаяние!

Спасибо, Трук

Ответы [ 2 ]

0 голосов
/ 21 мая 2011

Поскольку я не получаю ответов, я закрываю вопрос.В итоге я сделал модификацию, чтобы сделать класс изменения изображения в onload, удалить его из ошибки onerror и запустить остальную часть кода в окне onload.К сожалению, это означает, что 404 не будут перехвачены, прежде чем он попытается загрузить больше изображений, поэтому я вынужден ограничить максимальное количество изображений, которые могут быть использованы (изменяемые при вызове функции,) и изображений, которых нетпросто потратьте немного времени.

Смотрите окончательный результат здесь.

0 голосов
/ 11 мая 2011

Имеете ли вы право выполнять код php на этом файловом сервере пользователя? Если это так, проверьте их в php и выведите в images.js на этом сервере, а затем в html, сначала загрузите images.js, а затем ваш обычный javascript. Кстати, у jQuery были утечки памяти в ajax для ушей, не знаю про 1.6, но у 1.5 определенно были такие. если вы не хотите использовать ajax для передачи данных с сервера в javascript - используйте обычный javascript: http://www.w3schools.com/ajax/ajax_xmlhttprequest_send.asp

Редактировать: Определенно стоит проверить: http://fettig.net/weblog/2005/11/28/how-to-make-xmlhttprequest-connections-to-another-server-in-your-domain/

...