2015-07-03 5 views
1

Я использую jquery load() для загрузки нескольких элементов. Все работает хорошо.Функция запуска один раз после загрузки()

for(i = 0; i<item.length; i++){ 
    $('#parent'+i).load('file'+i+'.html',function(){ 
     customFunctions(); 
    }); 
} 

Мой вопрос, мне нужно запустить customFunctions() когда все завершает загрузку. Мой код работает несколько раз. Как я могу запустить customFunctions() один раз, только после того, как все файлы будут загружены полностью?

+1

Почему вы не называете это в конце '$ (document) .ready()'? @Becky – Varun

+0

Ваш опубликованный код на самом деле не имеет смысла. Вы не передаете какие-либо данные на сервер? В противном случае зачем вызывать один и тот же запрос в цикле for? –

+0

@Varun спасибо, но это срабатывает после загрузки страницы. Так что '$ (function() {}' не будет работать. – Becky

ответ

4

Речь идет о обещания, но вы можете сделать это:

var all_loaded = 0; 

for(var i = 0; i < item.length; i++){ 
    $('#parent' + i).load('file' + i + '.html',function(){ 
     ++all_loaded == item.length && customFunctions(); 
    }); 
} 

//++all_loaded: mean It is sum +1 when a file is loaded 

Так что, когда all_loaded равно item.length, функция загружается только в конце.

+1

Но все еще не объясняет цель 'for' loop –

+0

Я предполагаю, что причина в том, что он хочет изменить имя файла, например '' file '+ i +' .html'' –

+0

Я, это была моя первая мысль перед чтением комментария OP: «Это мой вопрос, который я внедрил внутри цикла for, потому что я не уверен, быть вне обратного вызова load(). Поэтому вместо этого звучит как проблема XY. –

0
for(var i = 0; i<item.length; i++){ 
    $('#parent').load('file.html',function(){ 
     if(i==(item.length-1)) 
      customFunctions(); 
    }); 
} 

Это должно сработать.

1

Добавить счетчик и обновить его при загрузке каждого файла. Когда текущее значение счетчика будет равно суммарному количеству файлов, которое вы хотите загрузить, затем вызовите свою функцию;

0

Попробуйте:

Ваша функция будет работать только, если запрос все нагрузки успешно

var item = {length:12}; 
runfunction = 0; 
for(i = 0; i<item.length; i++){ 
    $('#parent').load('t.html',function(responseText, textStatus, XMLHttpRequest){ 

     if (textStatus == "success") { 
      runfunction++; 
     } 
     /* you can write three line of code any where even after for loop according to your requirements*/ 
     if(runfunction == item.length){ 
     customFunctions(); 
     } 
    }); 
} 

function customFunctions(){ 
alert(1); 
} 
0

Есть несколько вариантов.

Вы можете просто следить в цикле:

var loadedCount = 0; 
for(i = 0; i<item.length; i++){ 
    $('#parent').load('file.html',function(){ 
    loadedCount++; 
    if (loadedCount === item.length) { 
     customFunctions(); 
    } 
    }); 
} 

Это будет получить работу для этого конкретного случая. Этот работает только в этом ограниченном дизайне, где вы знаете, сколько раз вы звоните, и можете доверять/полагать, что ни один из ваших запросов AJAX не завершится. В результате это не очень стабильный дизайн.

Смежные вопросы