我无法将 PHP 数组传递给 Javascript
I'm having trouble passing a PHP array to Javascript
我正在使用 PHP 和 javascript 创建横幅功能。我所有的图像都在文件夹 Images/banners 中,并由 PHP 动态添加,然后添加到 JavaScript 数组 "adImages"。那部分工作正常,因为我在查看源时可以在 JavaScript 中看到数组。但是,图片并未放置在页面上。
这是我的代码,我错过了什么?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Rotating Banners</title>
<?php
$dir = 'Images/banner';
$files = scandir($dir);
array_shift($files);
array_shift($files);
?>
<script language="Javascript" type="text/javascript">
// Setting variables
dir = Images/banner/
adImages = <?php echo json_encode($files); ?>;
thisAd = 0
imgCt = adImages.length
// Rotate function
function rotate() {
if (document.images) {
thisAd++
if (thisAd == imgCt) {
thisAd = 0
}
document.adBanner.src=dir+adImages[thisAd]
setTimeout("rotate()", 1 * 1000)
}
}
</script>
</head>
<body onload="rotate()">
<center>
<img src="" name="adBanner" alt="Ad Banner" />
</center>
</body>
</html>
在将您的 dir
var 设为字符串后似乎对我有用。使用您的 Chrome 开发人员工具/控制台为您指出错误。以下代码适用于我的两个示例图像:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Rotating Banners</title>
<?php
$dir = 'Images/banner';
$files = scandir($dir);
array_shift($files);
array_shift($files);
?>
<script language="Javascript" type="text/javascript">
// Setting variables
var dir = "Images/banner/",
adImages = <?php echo json_encode($files); ?>,
thisAd = 0,
imgCt = adImages.length;
// Rotate function
function rotate() {
if (document.images) {
thisAd++
if (thisAd == imgCt) {
thisAd = 0
}
document.adBanner.src=dir+adImages[thisAd]
setTimeout("rotate()", 1 * 1000)
}
}
</script>
</head>
<body onload="rotate()">
<center>
<img src="" name="adBanner" alt="Ad Banner" />
</center>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="jquery.js"></script>
<?php
$dir = '';
$files = array();
$dir = 'Images/banner';
$aExclusion = array( '..', '.' );
$files = array_diff(scandir($dir), $aExclusion);
$files = array_values( $files );
echo '<script>';
echo "var adImages = [];";
echo 'var oData = ' . json_encode( $files ) . ';';
echo '</script>';
?>
<script>
$(document).ready(function()
{
// Get banner count minus one for array offset.
iBannersSize = Object.keys(oData).length - 1;
// Ensure we have at least 1 banner to rotate.
if( iBannersSize > 0 )
{
window.setInterval(function(){
iChangeToImage = Math.round( Math.random() * ( iBannersSize - 0 ) );
$("div#banner_wrapper img").attr("src", 'Images/banner/' + oData[ iChangeToImage ] );
console.log( oData[ iChangeToImage ] );
}, 2000 );
}
});
</script>
</head>
<body>
<center>
<div id="banner_wrapper">
<!-- Render first banner on page load -->
<img src="<?php echo 'Images/banner/' . $files[ 0 ]; ?>" alt="Ad Banner">
</div>
</center>
</body>
</html>
我正在使用 PHP 和 javascript 创建横幅功能。我所有的图像都在文件夹 Images/banners 中,并由 PHP 动态添加,然后添加到 JavaScript 数组 "adImages"。那部分工作正常,因为我在查看源时可以在 JavaScript 中看到数组。但是,图片并未放置在页面上。
这是我的代码,我错过了什么?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Rotating Banners</title>
<?php
$dir = 'Images/banner';
$files = scandir($dir);
array_shift($files);
array_shift($files);
?>
<script language="Javascript" type="text/javascript">
// Setting variables
dir = Images/banner/
adImages = <?php echo json_encode($files); ?>;
thisAd = 0
imgCt = adImages.length
// Rotate function
function rotate() {
if (document.images) {
thisAd++
if (thisAd == imgCt) {
thisAd = 0
}
document.adBanner.src=dir+adImages[thisAd]
setTimeout("rotate()", 1 * 1000)
}
}
</script>
</head>
<body onload="rotate()">
<center>
<img src="" name="adBanner" alt="Ad Banner" />
</center>
</body>
</html>
在将您的 dir
var 设为字符串后似乎对我有用。使用您的 Chrome 开发人员工具/控制台为您指出错误。以下代码适用于我的两个示例图像:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Rotating Banners</title>
<?php
$dir = 'Images/banner';
$files = scandir($dir);
array_shift($files);
array_shift($files);
?>
<script language="Javascript" type="text/javascript">
// Setting variables
var dir = "Images/banner/",
adImages = <?php echo json_encode($files); ?>,
thisAd = 0,
imgCt = adImages.length;
// Rotate function
function rotate() {
if (document.images) {
thisAd++
if (thisAd == imgCt) {
thisAd = 0
}
document.adBanner.src=dir+adImages[thisAd]
setTimeout("rotate()", 1 * 1000)
}
}
</script>
</head>
<body onload="rotate()">
<center>
<img src="" name="adBanner" alt="Ad Banner" />
</center>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="jquery.js"></script>
<?php
$dir = '';
$files = array();
$dir = 'Images/banner';
$aExclusion = array( '..', '.' );
$files = array_diff(scandir($dir), $aExclusion);
$files = array_values( $files );
echo '<script>';
echo "var adImages = [];";
echo 'var oData = ' . json_encode( $files ) . ';';
echo '</script>';
?>
<script>
$(document).ready(function()
{
// Get banner count minus one for array offset.
iBannersSize = Object.keys(oData).length - 1;
// Ensure we have at least 1 banner to rotate.
if( iBannersSize > 0 )
{
window.setInterval(function(){
iChangeToImage = Math.round( Math.random() * ( iBannersSize - 0 ) );
$("div#banner_wrapper img").attr("src", 'Images/banner/' + oData[ iChangeToImage ] );
console.log( oData[ iChangeToImage ] );
}, 2000 );
}
});
</script>
</head>
<body>
<center>
<div id="banner_wrapper">
<!-- Render first banner on page load -->
<img src="<?php echo 'Images/banner/' . $files[ 0 ]; ?>" alt="Ad Banner">
</div>
</center>
</body>
</html>