将PHP循环与随机图像(javascript)代码相结合


Combining a PHP loop with a random image (javascript) code

嗨,我现在有一个php foreach循环来显示歌曲。

现在我想在"imagediv"中每次循环运行时都使用不同的图像(因此第一首歌曲为1.jpg,第二首歌曲为2.jpg,第三首歌曲为3.jpg,…)

我的问题是:我如何用javascript或html轻松地完成这一点?(注意:将图像放入数据库中不是一个选项)

btw:忽略?????在代码中,它是我希望图像代码所在的位置。

<?php foreach($results as $row): ?>
    <div id="titlefirst">
        <h2><?php echo $row->titel ?></h2>
    </div>
    <div id="song">
        <iframe width="100%" height="150" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?
        &url=<?php echo $row->teaser ?>&amp;color=color=0066cc&amp&amp;auto_play=false&amp;hide_related=false&amp;show_artwork=false"></iframe>
    </div>
    <div id="image">
        ??????
    </div>
    <div id="infom">
        <p>Componist: <?php echo $row->componist ?><br/>
        Tekstschrijver: <?php echo $row->tekstschrijver ?><br/>
        Taal: <?php echo $row->taal ?><br/>
        Thema: <?php echo $row->thema ?></p>
    </div>
<?php endforeach; ?>

添加迭代器$i(从0开始递增)

<?php foreach($results as $i => $row): ?>

使用它来形成图像src

<img src="/url/to/images/<?php echo $i+1; ?>.jpg" alt="<?php echo $row->titel ?>" />

<?php foreach($results as $i => $row): ?>
    <div id="titlefirst">
        <h2><?php echo $row->titel ?></h2>
    </div>
    <div id="song">
        <iframe width="100%" height="150" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?
        &url=<?php echo $row->teaser ?>&amp;color=color=0066cc&amp&amp;auto_play=false&amp;hide_related=false&amp;show_artwork=false"></iframe>
    </div>
    <div id="image">
        <img src="/url/to/images/<?php echo $i+1; ?>.jpg" alt="<?php echo $row->titel ?>" />
    </div>
    <div id="infom">
        <p>Componist: <?php echo $row->componist ?><br/>
        Tekstschrijver: <?php echo $row->tekstschrijver ?><br/>
        Taal: <?php echo $row->taal ?><br/>
        Thema: <?php echo $row->thema ?></p>
    </div>
<?php endforeach; ?>
<?php 
$count = 1;
foreach($results as $row){ ?>
            <div id="titlefirst">
                <h2><?php echo $row->titel ?></h2>
            </div>
            <div id="song">
                <iframe width="100%" height="150" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?
                &url=<?php echo $row->teaser ?>&amp;color=color=0066cc&amp&amp;auto_play=false&amp;hide_related=false&amp;show_artwork=false"></iframe>
            </div>
            <div id="image">
                <img src="images/<?php echo $count; ?>.jpg" />
            </div>
            <div id="infom">
                <p>Componist: <?php echo $row->componist ?><br/>
                Tekstschrijver: <?php echo $row->tekstschrijver ?><br/>
                Taal: <?php echo $row->taal ?><br/>
                Thema: <?php echo $row->thema ?></p>
            </div>
            <?php 
$count++;
} ?>