javascript - 调用两次 timeupdate

Question

调用两次 timeupdate 时遇到问题。我的代码是：

$("video").on(
    "timeupdate",
    function(event){
        alert('work');
    }
);

它工作，但如果我这样做：

$('#video').html( $('#newVideo').html());

以前的代码不起作用。

我尝试下一种方式也行不通：

1. <video id="video">

2. `$(document).on("timeupdate", 'video',

   $(document).delegate('video',

   $("视频").bind(,

   $(“视频”).live(`

Answer 1

调用.on()层次结构更高的元素以确保事件绑定适用于其下与选择器匹配的任何元素 - 无论该元素当前是否存在。

// this will work for all <video> elements within the document object
$(document).on("timeupdate", 'video', function(event){
    alert('work');
});
// if possible change 'document' to something that is
// closer up in the hierarchy to the video elements

Answer 2

我的解决方案是：

function initPlayer () {
    var player = $(document).find('video')[0];
    if (player) {
        player.addEventListener('timeupdate', function () {
            alert('work');
        }, false)
    }
}

必须在更改后和调用函数之前再次找到视频标签。这样：

$( "#button" ).click(function() {  
    $('#video').html( $('#newVideo').html());
    initPlayer();
});