如何在查询中插入变量值?

时间:2012-02-16 04:48:42

标签: jquery

我想编辑以下代码。(此代码来自[http://stackoverflow.com/a/9280414/945688]

<!DOCTYPE html>
<html>
  <head>
    <title>image</title>        
  </head>
  <body>

    <img id="img" src="1.jpg" />

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript">
      var interval = null;
      function changeImage(){
        var nextNum = parseInt($('#img').attr('src').replace('.jpg',''), 10) + 1;
        // If you want it to repeat back to 1 after 5
        nextNum = nextNum > 5 ? 1 : nextNum;
        $('#img').attr('src', nextNum+'.jpg');
      }

      $('#img').hover(
        function(){
          // Call change Image every 50ms
          interval = setInterval(changeImage, 50);
          changeImage();
        },
        function(){
          // Stop the call
          interval && clearInterval(interval);
        }
      );
    </script>
  </body>
</html>​​​​​​​​​​​​

上面的代码很好。但我想在图像路径中替换。

如果

    <?php $image_folder_path='imagenewfolder';?>
<img id="img" src="images/<?php echo $image_fold_path; ?>/1.jpg>

,如何编辑jquery代码。

1 个答案:

答案 0 :(得分:1)

试试这段代码。

var interval = null;
var imgPath = '<?php echo $image_path; ?>'; // it should have a trailing slash
      function changeImage(){
        var nextNum = parseInt($('#img').attr('src').replace(imgPath,'').replace('.jpg',''), 10) + 1;
        // If you want it to repeat back to 1 after 5
        nextNum = nextNum > 5 ? 1 : nextNum;
        $('#img').attr('src', imgPath + nextNum+'.jpg');
      }

      $('#img').hover(
        function(){
          // Call change Image every 50ms
          interval = setInterval(changeImage, 50);
          changeImage();
        },
        function(){
          // Stop the call
          interval && clearInterval(interval);
        }
      );