我想编辑以下代码。(此代码来自[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代码。
答案 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);
}
);