Передача переменной для функции в jquery AJAX success callback

Question

Я пытаюсь предварительно загрузить некоторые изображения с помощью вызова jQuery AJAX, но у меня есть реальные проблемы с передачей строки (url) в функцию в функции успеха вызова AJAX (если это имеет смысл).

Вот мой код, как есть стоит:

//preloader for images on gallery pages 
window.onload = function() { 
    setTimeout(function() {  
     var urls = ["./img/party/"]; //just one to get started 

     for (var i = 0; i < urls.length; i++) { 
      $.ajax({ 
       url: urls[i], 
       success: function(data,url) { 
        $(data).find("a:contains(.jpg)").each(function(url) {        
         new Image().src = url + $(this).attr("href"); 
        }); 
       } 
      }); 
     }; 
    }, 1000); 
}; 

можно увидеть мои (не удалось) попытку прохождения через URL в .each() вызов - url заканчивает принимает значение увеличения числа. Не знаете, почему или что это касается, может быть, количество файлов jpg?

... в любом случае, это должно, конечно, взять единственное значение в моем исходном массиве URL.

Благодарим за любую помощь. Кажется, я всегда испытываю зависть с этими обратными вызовами.

---

PROGESS?

Итак, я сброшенные вокруг немного, принимая внимание замечаний от @ron tornambe и @PiSquared и я в настоящее время здесь:

//preloader for images on gallery pages 
window.onload = function() { 
    var urls = ["./img/party/","./img/wedding/","./img/wedding/tree/"]; 

    setTimeout(function() { 
     for (var i = 0; i < urls.length; i++) { 
      $.ajax({ 
       url: urls[i], 
       success: function(data) { 
        image_link(data,i); 
        function image_link(data, i) { 
         $(data).find("a:contains(.jpg)").each(function(){ 
          console.log(i); 
          new Image().src = urls[i] + $(this).attr("href"); 
         }); 
        } 
       } 
      }); 
     }; 
    }, 1000);  
}; 

Я попытался положить image_link(data, i) здесь и везде (в каждой вложенной функции и т. д.), но я получаю тот же результат: значение для i регистрируется только как 3. Я подозреваю, что это связано с тем, что все ссылки на i указывают на одно и то же, и к тому времени, когда асинхронная задача фактически достигает image_link(data, i), цикл for... выполняется и выполняется с (и, следовательно, имеет значение 3). Излишне говорить, что это дает urls[i] как 'undefined'.

Любые (более) советы, как я могу обойти это?

Answer 1

Я просто пережил подобную проблему и считаю, что нашел решение.

Поскольку настройки объекта привязан к этому АЯКС вызова, вы можете просто добавить в индексатор в качестве пользовательской настройки, которые вы можете получить доступ с помощью this в обратный вызов:

//preloader for images on gallery pages 
window.onload = function() { 
    var urls = ["./img/party/","./img/wedding/","./img/wedding/tree/"]; 

    setTimeout(function() { 
     for (var i = 0; i < urls.length; i++) { 
      $.ajax({ 
       url: urls[i], 
       indexValue: i, 
       success: function(data) { 
        image_link(data , this.indexValue); 

        function image_link(data, i) { 
         $(data).find("a:contains(.jpg)").each(function(){ 
          console.log(i); 
          new Image().src = urls[i] + $(this).attr("href"); 
         }); 
        } 
       } 
      }); 
     }; 
    }, 1000);  
}; 

Хотелось бы надеяться, что делает то трюк.

Answer 2

попробовать что-то вроде этого (используйте this.url, чтобы получить URL):

$.ajax({ 
    url: 'http://www.example.org', 
    data: {'a':1,'b':2,'c':3}, 
    dataType: 'xml', 
    complete : function(){ 
     alert(this.url) 
    }, 
    success: function(xml){ 
    } 
}); 

Взятые из here

Answer 3

Вы не можете передавать параметры, как это - карты объектов успех анонимной функции с одним параметром, и это полученные данные. Создание функции вне для цикла, который принимает (data, i) в качестве параметров и выполнить код там:

function image_link(data, i) { 
    $(data).find("a:contains(.jpg)").each(function(){         
     new Image().src = url[i] + $(this).attr("href"); 
    } 
} 
... 
success: function(data){ 
    image_link(data, i) 
} 

Answer 4

Просто поделиться с подобной проблемой я имел в случае это может помочь кто-то, что я использовал:

var NextSlidePage = $("bottomcontent" + Slide + ".html"); 

сделать переменную для функции нагрузки, но я должен использовать:

var NextSlidePage = "bottomcontent" + Slide + ".html"; 

без $()

Не знаю, почему, но теперь это работает! Спасибо, наконец, я увидел, что случилось с этого поста!

Answer 5

Недавно я столкнулся с проблемой. Проблема возникает, когда длина имени файла превышает 20 символов. Итак, обход должен изменить длину имени файла, но трюк тоже хороший.

$.ajaxSetup({async: false}); // passage en mode synchrone 
$.ajax({ 
    url: pathpays, 
    success: function(data) { 
     //debug(data); 
     $(data).find("a:contains(.png),a:contains(.jpg)").each(function() { 
     var image = $(this).attr("href"); 
     // will loop through 
     debug("Found a file: " + image); 
     text += '<img class="arrondie" src="' + pathpays + image + '" />'; 
     }); 
     text = text + '</div>'; 
     //debug(text); 
    } 
}); 

После еще расследования беда приходит из запроса AJAX: Поместите глаз в HTML код, возвращаемый AJAX:

<a href="Paris-Palais-de-la-cite%20-%20Copie.jpg">Paris-Palais-de-la-c..&gt;</a> 
</td> 
<td align="right">2015-09-05 09:50 </td> 
<td align="right">4.3K</td> 
<td>&nbsp;</td> 
</tr> 

Как вы можете видеть имя файла расщепляется после символа 20, поэтому $(data).find("a:contains(.png)) не может найти правильное расширение.

Но если вы проверите значение параметра href, оно будет содержать полное имя файла.

Я не знаю, могу ли я попросить ajax вернуть полное имя файла в текстовой области?

Надежда быть ясно

Я нашел правильный тест, чтобы собрать все файлы:

$(data).find("[href$='.jpg'],[href$='.png']").each(function() { 
var image = $(this).attr("href"); 

Answer 6

Вы также можете использовать indexValue атрибут для передачи нескольких параметров с помощью объекта:

var someData = "hello"; 

jQuery.ajax({ 
    url: "http://maps.google.com/maps/api/js?v=3", 
    indexValue: {param1:someData, param2:"Other data 2", param3: "Other data 3"}, 
    dataType: "script" 
}).done(function() { 
    console.log(this.indexValue.param1); 
    console.log(this.indexValue.param2); 
    console.log(this.indexValue.param3); 
}); 

Answer 7

Я делаю это так:

function f(data,d){ 
    console.log(d); 
    console.log(data); 
} 
$.ajax({ 
    url:u, 
    success:function(data){ f(data,d); } 
});