我是初学者,所以请耐心等待。
我正在使用jquery.elevatezoom.js
来缩放图像。
它工作正常,但问题是当我使用 PHP 的 include 函数在我的dashboard.php
中命名这个文件时说showimage.php
,showimage.php
中定义的 jquery 函数没有执行,因此我没有得到缩放。
我有一个仪表板。当我单击一个按钮时,它绑定到在仪表板中加载页面的 JavaScript 函数,并且加载的页面是一个包含 showimage.php
的 PHP 文件。
-
Jquery.min
在仪表板的加载事件中调用。 -
仪表板有一个按钮,单击该按钮时会加载第一个加载的 php 文件
showimage.php
使用 PHP 的包含函数。
这是showimage.php
的代码:
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'/>
<title>jQuery elevateZoom Demo</title>
<script src='jquery.elevatezoom.js'></script>
</head>
<body>
<h1>Basic Zoom Example</h1>
<img id="zoom_01" src='images/large/image1.jpg' width="250px" height="250px" data-zoom-image="images/large/image1.jpg"/>
<br />
<script>
$('#zoom_01').elevateZoom({easing : true});
</script>
</body>
</html>
details.php
<?PHP
include 'showimage.php';
?>
谁能帮我确定为什么缩放不起作用?
也许脚本在 html 完成之前正在执行以添加元素,因此您可以在几秒钟后尝试调用它,在您的 showimage.php 文件中类似这样。
<script type="text/javascript">
setTimeout(function(){
$('#zoom_01').elevateZoom({easing : true});
}, 3000);
</script>
在 ready 事件上使用,并像这样进行 jquery 调用:
<script>
$(document).ready(function(){
$('#zoom_01').elevateZoom({easing : true});
});
并将JavaScript放在包含的PHP文件之后。
顺便说一句,我在您的文档中没有看到包含的 jquery 库?
仅在文档准备就绪时才尝试使用它。您已经包含了jquery,因此请执行以下操作:
$(document).ready(function(){
// you move it to here so only when your page is done loading it will add the event handler
$('#zoom_01').elevateZoom({easing : true});
})