JQuery 点击事件只工作一次，<iframe> 更新

Question

使用 slick.js 来滚动列表。当点击 URL 时，iframe 更新一次。

HTML

<ul class="videoLive clearfix" id="videoSlide" role="tablist">

<li>

    <a class="changeVideo" data-yt-video="https://mover.uz/video/embed/1VZp5pTm/">Click me!</a>

</li>

<li>

    <a class="changeVideo" data-yt-video="https://www.youtube.com/embed/P3z7Vprxwx0">Click me 2!</a>

</li>

</ul>

<div class="video-container" id="video01" data-current-video="https://mover.uz/video/embed/1VZp5pTm/">

    <iframe width="100%" height="100%" src="https://mover.uz/video/embed/1VZp5pTm/" class=liveVideo allowfullscreen=""></iframe>

</div>

JS

var videoElement = $('#video01');

$('.changeVideo').on('click', function () {

    var $this = $(this);

    var parentli = $this.parent('li');

    parentli.siblings('li').removeClass('active');

    var videourl = $this.data('yt-video');

    if(videoElement.data('current-video') !== videourl){

        videoElement.html('<iframe width="100%" height="100%" src="' + videourl + '" class="liveVideo" allowfullscreen=""></iframe>');

        videoElement.attr('data-current-video', videourl);

        parentli.addClass('active');

    }

});

问题是 on('click') 只工作一次，没有更新两次。我做错了什么？

附加信息：Jquery 版本。3.4.1; 与 Yii2 一起工作。控制台上没有错误。

Answer 1

您可以使用绑定功能&nbsp; &nbsp; $('li').bind( "click", function () {&nbsp; &nbsp; &nbsp; &nbsp; console.log("click")&nbsp; &nbsp; });您可以根据需要更改选择器。