ajax请求使页面滞后

时间:2016-03-06 08:05:33

标签: javascript php jquery sql ajax

我有这个ajax请求代码

function hehe2(){
  var a = $(".film2numb").val();
  return $.ajax({
    type : "GET",
    url : "php/controller1.php?page=semuafilm",
    data : "data="+a,
    cache: false,
    success: function(data){
      $('.semuafilm').load('php/film.php');
    },
  });
}

并且它请求这个PHP代码,基本上它从SQL打印出HTML数据

      <?php            
        $indicator = $_SESSION['p'];
        if ($indicator == 'filmbaru') {
          # code...
          $batas = $_SESSION['a'];
          if (!$batas) {
            $batas = 1;
          }
          if ($batas>1) {
            $batas = $batas * 8;
          }
          include('connect.php');
          $queryfilm = "select * from tb_film order by film_year desc, film_id desc limit $batas ,8";
          $exec =  $conn->query($queryfilm);
            while ( $f = $exec->fetch_assoc()) {
         $tn = str_replace(" ","-",$f['film_name']) ;
      ?>
      <div class='col l3 m3 s6 itemovie'><div><img src="images/dum.jpg" class="lazy" data-original='http://www.bolehnonton.com/images/logo/<?php echo $f["film_logo"]; ?>' width="214" height="317"><div><div><div><p><b><?php echo $f['film_name']; ?></b></p><p>IMDB Rating</p><p><?php echo $f['film_genre']; ?></p><p class='center-align linkmov'><a class='dpinblock browntex' href='?page=movie&filmname=<?php echo $tn; ?>'>PLAY MOVIE</a></p><p class='center-align linkmov'><a class='dpinblock' href=''>SEE TRAILER</a></p></div></div></div></div></div>
      <?php
          }
      ?>

这是控制器

            <?php 
                session_start();
                $a = $_GET['data'];
                $p = $_GET['page'];
                $g = $_GET['genre'];

                $_SESSION['a'] = $a;
                $_SESSION['p'] = $p;
                $_SESSION['g'] = $g;
             ?>

我的问题是为什么每当我点击绑定到hehe2()功能的按钮(4-5次,请求大量图像)时,页面会变得更重,因为我逐渐点击(滞后,慢滚动) ,有没有办法让它更轻,或者有没有办法不在页面上存储图像缓存或每次单击绑定到hehe2()功能的按钮时清除?

1 个答案:

答案 0 :(得分:0)

我不确定我的建议会有所帮助,我将分享我的经验。 首先,你应该检查你的绑定。你只绑定一次点击触发器吗? 有时函数会多次绑定,这会使页面变慢。 您可以将代码置于函数内并检查控制台

console.log("Function called");

如果从那一点开始一切正常并且功能只发射一次 - 我建议你稍微改变一下流量。是否可以连续避免多次点击?如果没什么大不了的 - 你可以在AJAX请求完成时禁用点击按钮,show loader和启用按钮。这种方法可以防止在页面上一次发出多个请求会更快。