我在我的项目中使用背景画廊插件(http://buildinternet.com/project/supersized/),但是当我将它附加到我的wordpress网站时,我发现了一个问题,我无法处理。该图库通过javascript调用图像。函数是这样的:
<script type="text/javascript">
jQuery(function($){
$.supersized({
slides : [
{image : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/slides/kazvan-1.jpg'},
{image : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/slides/kazvan-2.jpg'},
{image : 'http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/slides/kazvan-3.jpg'}
]
});
});
</script>
问题是,我需要显示的图像是从wordpress数据库。在javascript中,我不知道它是如何工作的。有办法调用php吗?我使用的php foreach请求没有画廊插件调用图像是这样的:
<?php foreach ( $images as $image ) : ?>
<img src="<?php echo $image->thumbnailURL ?>" />
<?php if ( $image->hidden ) continue; ?>
<?php if ( $gallery->columns > 0 && ++$i % $gallery->columns == 0 ) { ?>
<?php } ?>
<?php endforeach; ?>
谢谢你的帮助
你可以将这段PHP代码用于echo this javascript
<script type="text/javascript">
jQuery(function($){
$.supersized({
slides : [
<?php $out=array();
foreach ( $images as $image ){
if ( $image->hidden ) continue;
$out[]="{image :'".$image->thumbnailURL."'}";
}
echo implode(",",$out);?>
]
});
});
</script>
或者你也可以使用json因为幻灯片的输入是json请看这个页面如何对url进行json调用?
所有你的网页正在做的是准备一个最终的答案被发送到客户端的浏览器读取。要准备这个答案,可以同时使用服务器端和客户端代码,不管它们是如何混合在一起的。如果在脚本定义中需要数据库元素,可以这样做:
<script type="text/javascript">
// client-side
<?php
// server-side
?>
// client-side
</script>