2014-08-26 2 views
-5

МОЕЙ AJAX ЗАПРОСЛенивая ошибка загрузки в первый раз JQuery

$.ajax({ 
    type: "POST", 
    data: "{'id':'" + id + "'}", 
    contentType: "application/json; charset=UTF-8", 
    dataType: "json", 
    url: "../WebService.asmx/getallimages", 
    success: function (data) { 
     //getting image srcs here 
     for (var i = 0; i < s; i++) { 
      counter_xyz++; 
      if(counter_xyz<10) { 
       $("#holding_img_" + variable[i]).attr("src", variable[i].src); 
      } else { 
       $("#holding_img_" + variable[i]).attr("data-orig", variable[i].src); 
      } 
     } 
     $("img.lazy").show().lazyload({ 
      data_attribute: "orig"     
     }); 
    } 
    error : function (data) { 

    } 
}); 

Использовал tuupola..jquery_lazyload плагин .. Сво работает нормально, но в первый раз, когда пользователь открывает сайт .. его не получает применяется Lazy load не работает, когда весь кеш очищается. Не работаю в том смысле, что unscrolled изображение части также загружается и видимы ..

я не получаю, как решить эту ошибку ..

Примечание- Только первый раз это происходит ..

+2

'для (var i = 0; i

+0

Прежде всего, вы пропустили запятую перед объявлением 'error' –

+1

данные shoud'nt be stringified:' data: {id: id}, 'should works. А что такое 'переменная' и что вы делаете с' data'? – KyleK

ответ

2

Я думаю, запятая отсутствует после успешного обратного вызова. Не могли бы вы проверить это.

0

Убедитесь, что вы держите свой код внутри

$(document).ready(function(){}); 

Это может помочь!

$(document).ready(function() 
{ 

//Your ajax call.. 

}); 
2

Я видел этот вопрос вы говорите ... не исследовали достаточно глубоко, чтобы понять, почему это происходит - но вот решение: загрузите скрипты (JQuery и LazyLoad) без использования кэша браузера , то с помощью инъекционного их в страницу с помощью функции «loadScript»:

Протестировано под FF 32.0.3 (оригинальный выпуск в Chrome - из-за строгой политики MIME типа в LazyLoad сценарии)

<!doctype html> 

<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>JQUERY LazyLoad</title> 
</head> 

<body> 
    <img id="holding_img_1" class="lazy"/> 
    <img id="holding_img_2" class="lazy"/> 
    <img id="holding_img_3" class="lazy"/> 
    <img id="holding_img_4" class="lazy"/> 
    <img id="holding_img_5" class="lazy"/> 
    <img id="holding_img_6" class="lazy"/> 
    <img id="holding_img_7" class="lazy"/> 
    <img id="holding_img_8" class="lazy"/> 
    <img id="holding_img_9" class="lazy"/> 
    <img id="holding_img_10" class="lazy"/> 
    <img id="holding_img_11" class="lazy"/> 
    <img id="holding_img_12" class="lazy"/> 
    <img id="holding_img_13" class="lazy"/> 
    <img id="holding_img_14" class="lazy"/> 
    <img id="holding_img_15" class="lazy"/> 
    <script> 
     "use strict"; 
      function callback(data) { 
       alert(data); 
      } 
      function loadScript(scriptSrc, jqueryLoaded) { 
       var script = document.createElement('script'); 
       script.type = 'text/javascript'; 
       script.async = false; 
       script.onload = function(){ 
        if (jqueryLoaded) { 
         $.ajax({ 
          type: "POST", 
          //data: "{'id':'" + id + "'}", 
          contentType: "application/javascript; charset=UTF-8", 
          dataType: "jsonp", 
          url: "http://localhost:8080/images/?callback=callback", 
          success: function (data) { 
           console.log(data); 
           //getting image srcs here 
           for (var i = 0; i < data.length; i++) { 
            //counter_xyz++; 
            //console.log(i); 
            if(i<10) { 
             $("#holding_img_" + i).attr("src", "http://localhost:8080/image/"+(i+1)+".jpg"); 
            } else { 
             $("#holding_img_" + i).attr("data-orig","http://localhost:8080/image/"+(i+1)+".jpg"); 
            } 
           } 
           $("img.lazy").show().lazyload({ 
            data_attribute: "orig"     
           }); 
          }, 
          error : function (data) { 

          } 
         }); 
        } 
        else { 
         loadScript("https://raw.githubusercontent.com/tuupola/jquery_lazyload/master/jquery.lazyload.min.js", true);      
        } 

       }; 
       script.src = scriptSrc; 
       document.getElementsByTagName('head')[0].appendChild(script);   
      }; 
      loadScript("http://code.jquery.com/jquery-1.11.1.min.js"); 
    </script> 
</body> 
</html> 
Смежные вопросы