Question

我正在使用PHP和javascript来创建横幅功能。我的所有图像都在图像/横幅文件夹中，并由PHP动态添加，然后添加到Java脚本数组“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>

Answer 1

在使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>

Answer 2

<!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时遇到问题

2 个答案: