У меня проблемы с передачей массива PHP в Javascript

0

Я использую PHP и javascript для создания функции баннера. Все мои изображения находятся в папке "Изображения/баннеры" и динамически добавляются PHP, а затем добавляются в массив JavScript "adImages". Эта часть работает нормально, так как я вижу массив в JavaScript, когда я viewouce. Однако изображения не помещаются на страницу.

Вот мой код, чего мне не хватает?

<!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>
Теги:
arrays
banner

2 ответа

1
Лучший ответ

Кажется, я работаю для меня после того, как ваш dir var string. Использование Chrome Developer Tools/Console показало вам ошибки. Следующий код работает для меня с двумя образцами:

<!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>
  • 0
    Спасибо :) Я думал, что это, вероятно, что-то глупое, что я упустил из виду
  • 0
    Не беспокойтесь :) Если это решит вашу проблему, вы не против принять ответ. Помогает другим, которые приходят в поисках ответов после вас. Спасибо!
0
<!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>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню