2014-09-09 2 views
-2

웹 사이트를 운영하고있어 탐색 할 때 URL을 전혀 변경하지 않길 바랍니다. 그래서 나는 완전히 AJAX 생성 된 컨텐츠를 사용하고 있습니다. 그것은 것 먼저 페이지에 도착했을 때 "뉴스"또는 "TV"중 하나를 클릭하면 그래서 모든 괜찮지 만 http://nestecha.fr/confi/AJAX가 올바른 콘텐츠를 일관되게 표시하지 않음

: 여기

링크의

  • 가 가끔 작동 절대적으로 좋아요. 그리고 원하는대로 모든 콘텐츠를 생성하십시오.
  • 때로는 전혀 작동하지 않고 내용이 무작위로 생성되며 때로는 한 행이로드되고 때로는 올바른 방법으로 순서가 지정되지도 않고 때로는 아무것도로드되지 않습니다.

나는 무작위로 보입니다. 때로는 효과가 있고 때로는 그렇지 않습니다.

왜 그럴까요?

감사합니다.

여기 내가 믿는 가장 중요한 코드의 일부 것은 결함이 :

// When we click on "News" 
$('li a[href^=index]').on('click', function() { 
    event.preventDefault(); 

    var $sPage = ''; 
     $.ajax({ 
      url: 'webservice/newsShowReel.php', 
      dataType: 'json' 
     }) 
      .done(function (result) { 
       $sPage += '<div class="container">'; 
       $sPage += '<div class="row"><div class="col-xs-12 text-center title"><h1>Show Réel</h1></div></div>'; 
       $sPage += '<div class="row">'; 
       $sPage += '<section class="col-xs-12 text-center showreel">'; 
       $sPage += '<div class="view view-third">'; 
       $sPage += '<img src="'+ result['image'] +'" class="img-responsive">'; 
       $sPage += '<div class="mask">'; 
       $sPage += '<h2>'+ result['titre'] +'</h2>'; 
       $sPage += '<p>'+ result['description'] +'</p>'; 
       $sPage += '<a class="fancybox-media info" rel="group" href="'+ result['lien'] +'">Visionner</a>'; 
       $sPage += '</div>'; 
       $sPage += '</div>'; 
       $sPage += '</section>'; 
       $sPage += '</div>'; 
      }); 
    $.ajax({ 
     url: 'webservice/newsNouveautes.php', 
     dataType: 'json' 
    }) 
     .done(function(result) { 
      $sPage += '<div class="row"><div class="col-xs-12 text-center title"><h1>Nouveautés</h1></div></div>'; 
      $sPage += '<div class="row">'; 
      $sPage += '<div id="owl">'; 
      $.each(result, function(key, resultSingle) { 
       $sPage += '<div class="item">'; 
       $sPage += '<div class="viewSmall view-thirdSmall">'; 
       $sPage += '<img src="'+ resultSingle['image'] +'" class="img-responsive">'; 
       $sPage += '<div class="maskSmall">'; 
       $sPage += '<h2>'+ resultSingle['titre'] +'</h2>'; 
       $sPage += '<p>'+ resultSingle['description'] +'</p>'; 
       $sPage += '<a class="fancybox-media info" rel="group" href="'+ resultSingle['lien'] +'">Visionner</a>'; 
       $sPage += '</div>'; 
       $sPage += '</div>'; 
       $sPage += '</div>'; 
      }); 
      $sPage += '</div>'; 
      $sPage += '</div>'; 
      $sPage += '</div>'; 
     }); 

    $('#page').fadeOut('slow', function() { 
     $('#page').html($sPage).fadeIn('slow'); 

     $("#owl").owlCarousel({ 

      autoPlay: false, //Set AutoPlay to 3 seconds 

      items : 4, 
      itemsDesktop : [1199,4], 
      itemsDesktopSmall : [990,2] 

     }); 
    }); 
}); 
+1

우리에게 몇 가지 코드를 보여주십시오 -도 염두에 베어 콘솔이 중단 섹션을 시도하고 콘솔을보고 이런 것들에 대한 당신의 가장 친한 친구입니다. – Alex

+0

모든 코드가 AJAX이기 때문에 공유하지 않았으므로 모든 것이 js/jQuery.js 폴더에 투명하게 기록됩니다. 너무 많은 코드로 스팸 메일을 보내고 싶지 않았습니다./PHP 파일의 경우 json 정보를 보내면 올바른 정보를 보냅니다. – user3807702

+1

문제를 해결하는 데 도움을 주면 링크가 작업 코드를 가리 킵니다. 미래에 이것을 읽는 사람은 어떻게 문제를 이해하고 이것이 어떻게 고쳐 졌는지보아야합니다. – Barmar

답변

0

내 문제에 answser을 발견하고 왜 작동하지 않습니다. 내가 가진

// When we click on "News" 
$('li a[href^=index]').on('click', function() { 
    event.preventDefault(); 

    var $sPage = ''; 
     $.ajax({ 
      url: 'webservice/newsShowReel.php', 
      dataType: 'json' 
     }) 
      .done(function (result) { 
       $sPage = '<div class="container">'; 
       $sPage += '<div class="row"><div class="col-xs-12 text-center title"><h1>Show Réel</h1></div></div>'; 
       $sPage += '<div class="row">'; 
       $sPage += '<section class="col-xs-12 text-center showreel">'; 
       $sPage += '<div class="view view-third">'; 
       $sPage += '<img src="'+ result['image'] +'" class="img-responsive">'; 
       $sPage += '<div class="mask">'; 
       $sPage += '<h2>'+ result['titre'] +'</h2>'; 
       $sPage += '<p>'+ result['description'] +'</p>'; 
       $sPage += '<a class="fancybox-media info" rel="group" href="'+ result['lien'] +'">Visionner</a>'; 
       $sPage += '</div>'; 
       $sPage += '</div>'; 
       $sPage += '</section>'; 
       $sPage += '</div>'; 
      }); 
    $.ajax({ 
     url: 'webservice/newsNouveautes.php', 
     dataType: 'json' 
    }) 
     .done(function(result) { 
      $sPage += '<div class="row"><div class="col-xs-12 text-center title"><h1>Nouveautés</h1></div></div>'; 
      $sPage += '<div class="row">'; 
      $sPage += '<div id="owl">'; 
      $.each(result, function(key, resultSingle) { 
       $sPage += '<div class="item">'; 
       $sPage += '<div class="viewSmall view-thirdSmall">'; 
       $sPage += '<img src="'+ resultSingle['image'] +'" class="img-responsive">'; 
       $sPage += '<div class="maskSmall">'; 
       $sPage += '<h2>'+ resultSingle['titre'] +'</h2>'; 
       $sPage += '<p>'+ resultSingle['description'] +'</p>'; 
       $sPage += '<a class="fancybox-media info" rel="group" href="'+ resultSingle['lien'] +'">Visionner</a>'; 
       $sPage += '</div>'; 
       $sPage += '</div>'; 
       $sPage += '</div>'; 
      }); 
      $sPage += '</div>'; 
      $sPage += '</div>'; 
      $sPage += '</div>'; 
     }); 

    $('#page').fadeOut('slow', function() { 
     $('#page').html($sPage).fadeIn('slow'); 

     $("#owl").owlCarousel({ 

      autoPlay: false, //Set AutoPlay to 3 seconds 

      items : 4, 
      itemsDesktop : [1199,4], 
      itemsDesktopSmall : [990,2] 

     }); 
    }); 
}); 

문제는 지속적으로 올바른 콘텐츠를 표시하지 않은 :

원래 코드는 다음을이었다. 또한 AJAX 요청이 많을수록 디스플레이가 제대로 표시되지 않았습니다. 문제는 여러 AJAX 요청을 동시에 수행하면 결과가 좋지 않다는 것입니다. 그래서 전에 요청이 끝나면 AJAX 요청을했습니다.

여기에 지속적으로 작동하는 새로운 코드입니다 :

$('li a[href^=index]').on('click', function() { 
    event.preventDefault(); 

    var $sPage = ''; 
     $.ajax({ 
      url: 'webservice/newsShowReel.php', 
      dataType: 'json' 
     }) 
      .success(function (result) { 
       $sPage = '<div class="container">'; 
       $sPage += '<div class="row"><div class="col-xs-12 text-center title"><h1>Show Réel</h1></div></div>'; 
       $sPage += '<div class="row">'; 
       $sPage += '<section class="col-xs-12 text-center showreel">'; 
       $sPage += '<div class="view view-third">'; 
       $sPage += '<img src="'+ result['image'] +'" class="img-responsive">'; 
       $sPage += '<div class="mask">'; 
       $sPage += '<h2>'+ result['titre'] +'</h2>'; 
       $sPage += '<p>'+ result['description'] +'</p>'; 
       $sPage += '<a class="fancybox-media info" rel="group" href="'+ result['lien'] +'">Visionner</a>'; 
       $sPage += '</div>'; 
       $sPage += '</div>'; 
       $sPage += '</section>'; 
       $sPage += '</div>'; 

       $.ajax({ 
        url: 'webservice/newsNouveautes.php', 
        dataType: 'json' 
       }) 
        .success(function(result) { 
         $sPage += '<div class="row"><div class="col-xs-12 text-center title"><h1>Nouveautés</h1></div></div>'; 
         $sPage += '<div class="row">'; 
         $sPage += '<div id="owl">'; 
         $.each(result, function(key, resultSingle) { 
          $sPage += '<div class="item">'; 
          $sPage += '<div class="viewSmall view-thirdSmall">'; 
          $sPage += '<img src="'+ resultSingle['image'] +'" class="img-responsive">'; 
          $sPage += '<div class="maskSmall">'; 
          $sPage += '<h2>'+ resultSingle['titre'] +'</h2>'; 
          $sPage += '<p>'+ resultSingle['description'] +'</p>'; 
          $sPage += '<a class="fancybox-media info" rel="group" href="'+ resultSingle['lien'] +'">Visionner</a>'; 
          $sPage += '</div>'; 
          $sPage += '</div>'; 
          $sPage += '</div>'; 
         }); 
         $sPage += '</div>'; 
         $sPage += '</div>'; 
         $sPage += '</div>'; 
        }); 
      }); 

    $('#page').fadeOut('slow', function() { 
     $('#page').html($sPage).fadeIn('slow'); 

     $("#owl").owlCarousel({ 

      autoPlay: false, //Set AutoPlay to 3 seconds 

      items : 4, 
      itemsDesktop : [1199,4], 
      itemsDesktopSmall : [990,2] 

     }); 
    }); 
}); 
관련 문제