Jquery Ротатор Ajax функция запуска рано - PullRequest
1 голос
/ 28 декабря 2011

Я делаю вращатель Testimonial с Jquery для моего сайта, но функция Ajax запускается слишком рано, поэтому вы видите изменение HTML, затем оно исчезает и возвращается. Я пытался выяснить проблему, но Я не могу найти это.

<div class="testimonials">
    <div id="testimonial"></div>
</div>
<script type="text/javascript">
    function loadTestimonial(){
        $("#testimonial").fadeOut(1000);
        $.ajax({
            url: "r/get_testimonial.php",
            cache: false,
            async: false,
            timeout: 1000,
            success: function(html){
                $("#testimonial").html(html);
            },
          });   
          setTimeout($("#testimonial").fadeIn(1000), 2000);
      } 
      $(document).ready(function(){
        loadTestimonial();
        setInterval (loadTestimonial, 5000) 
      });
</script>

1 Ответ

1 голос
/ 28 декабря 2011

Попробуйте этот код:

<div class="testimonials">
    <div id="testimonial"></div>
</div>
<script type="text/javascript">
    function loadTestimonial(){
        $("#testimonial").fadeOut(1000, function(){
            $.ajax({
                url: "r/get_testimonial.php",
                cache: false,
                async: false,
                timeout: 1000,
                success: function(html){
                    $("#testimonial").html(html).fadeIn(1000);
                },
              });   
        });
      } 
      $(document).ready(function(){
        loadTestimonial();
        setInterval (loadTestimonial, 5000) 
      });
</script>

Что не так с вашим кодом?Код ajax был вызван сразу, что заменит старый HTML, когда он будет готов, что я делаю выше - дождусь обратного вызова fadeOut() и затем вызову функцию Ajax.Который получит исходный код и fadeIn новый HTML.

Вы можете подумать, что это функция синхронизации (потому что Ajax имел async: false), но jQuery fadeOut также является асинхронным, поэтому вы не можетеподожди, как ты.

...