将PHP循环与随机图像（javascript）代码相结合

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

现在，我希望在image div中每次循环运行时都有一个不同的图像，因此第一首歌为1.jpg，第二首歌为2.jpg，第三首歌为3.jpg

我的问题是：如何使用javascript或html轻松实现这一点？ 注意：将图像放入数据库不是一个选项

顺便说一句：忽略这个？？？？？在代码中，它是我希望图像代码所在的位置

<?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; ?>

---

感谢您的回复，这段代码会导致一个未定义的变量错误：/哪一个是未定义的$计数？看起来好像没有错误，我认为OP忽略了给定答案中除行之外的所有内容。当foreach循环可以使用数组的隐含键时，您不应该设置并持续更新$count。@MatthiasVerhoeven实际上已经阅读了答案，不要只跳到您认为有变化的那一位，我的错，对不起。再次感谢，谢谢！如何修复未定义变量：此处出现错误？应该没有未定义变量通知。你改变了foreach行还是直接跳到img？是的，我的错，我忘了，谢谢，现在可以了！真的非常感谢！

<?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++;
} ?>