Javascript 使用jQuery从链接列表播放第一个youtube嵌入视频

我正在调用一个循环来生成youtube嵌入视频的链接列表。当我点击任何链接时，相关视频将在iFrame中打开。但问题是，当我第一次加载页面时，它不会在iFrame甚至iFrame中显示任何视频。我需要点击一个链接来加载视频。我想在加载页面时自动加载列表的第一个视频

iFrame视频：

    <h4 id="videoTitle"></h4>
    <div class="embed-responsive embed-responsive-16by9">
        <iframe id="frame" name="frame" width="560" height="315" src="about:blank" frameborder="0" 
            allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
            allowfullscreen>
        </iframe>
    </div>

这是生成视频列表的循环，我使用的是laravel，代码如下所示：

@foreach($topic->videos as $video)
    <li>
        <a href="{{ $video->url }}" class="ytLink">Play Video</a>
    </li>
@endforeach

@foreach（$topic->videos as$video）


@endforeach

以下是我的jQuery代码：

<script>
    $('.ytLink').on('click', function (e) {
         $('#frame')[0].src = $(this).attr('href') + '?autoplay=1';
         e.preventDefault();
         $('#videoTitle').text($(this).text());
    });
</script>

$（'.ytLink'）。在（'click'，函数（e）上{
$（'#frame'）[0].src=$（this.attr（'href'）+'？自动播放=1'；
e、 预防默认值（）；
$（'#videoTitle'）.text（$（this.text（））；
});

---

有谁能帮我自动加载第一个视频吗？

加载文档时，我触发了单击您的第一个链接

我使用

$（document）.ready（）

函数在加载文档并准备使用时执行代码。 我将您的代码粘贴到此函数中。在我找到您的第一个带有

$（'.ytLink'）.eq（0）

的链接后，我将在此元素上使用

.trigger（'click'）

。因此，该触发器将在加载文档时运行

更多关于函数的信息

以及有关该函数的更多信息。

$（文档）.ready（函数（）{
$（'.ytLink'）。在（'click'，函数（e）上{
$（'#frame'）[0].src=$（this.attr（'href'）+'？自动播放=1'；
e、 预防默认值（）；
$（'#videoTitle'）.text（$（this.text（））；
});
$（'.ytLink'）.eq（0）.trigger（'click'）；
});