Làm cách nào để bạn có thể phát hiện xem thẻ âm thanh HTML5 đã được nghe trong ít nhất x giây chưa?

Question

Tôi muốn đăng nhập khi người dùng nghe phần tử âm thanh trong hơn 5 giây. Làm thế nào tôi có thể phát hiện điều này với HTML5?

Answer 1

Tôi sẽ xử lý sự kiện phát và sau đó sử dụng theo dõi cuộc gọi setTimeout khi chúng hoàn tất. Nội dung như thế này (mã giả):

var timeHandler = null; 

// if they stop listening, don't give them the alert 
    myAudioElement.addEventListener('stop', function() { 
    if (timeHandler) clearTimeout(timeHandle); 
    }); 

// when they start to play, set an event to pop up 5 seconds later 
    myAudioElement.addEventListener('play', function() { 
     timeHandler = setTimeout(5000,function() { 
      // here I would make some kind of ajax call to log the event 
      alert("it's been 5 seconds!"); 
     }); 

Như mọi khi, điều này có thể phức tạp hơn tùy theo nhu cầu của bạn. Bạn cũng có thể sử dụng sự kiện ontimeupdate để theo dõi vị trí hiện tại của playhead. Để tham khảo về các sự kiện âm thanh html5, hãy xem trang này:

https://developer.mozilla.org/en/DOM/Media_events

Chúc may mắn!