Question

有人告诉我同时使用事件oncanplay和oncanplaythrough事件，因为oncanplay在某些浏览器中可能不可靠：

在我的代码中，我仅使用oncanplay事件。有人告诉我如何设置代码，以便能够使用这两个事件？

// player is an HTML5 Audio Element

player.oncanplay = function () {
        if (value.value !== "") {
            canPlay = true;
            playPauseIcon(true);
        }
    };

我的完整代码清单在这里：https://jsfiddle.net/vhgL96se/142/

Answer 1

如果您担心canplay事件没有触发，可以同时使用canplaythrough和canplay事件。根据您的代码，应该有可能或多或少地为两个事件重用同一事件处理程序。

请考虑以下更改，即使用addEventListener()注册这两个事件的处理程序，以及使用略微修改的逻辑声明公共处理程序功能：

// Define a common handler function that will be reused for
// both events
function playerMediaPlayable() {

    // Add canPlay !== true to prevent playPauseIcon() being
    // called a second time if 'canplaythrough' fires after 'canplay'
    if (value.value !== "" && canPlay !== true) {

        canPlay = true;
        playPauseIcon(true);
    }
}

// Use playerMediaPlayable handler for both events
player.addEventListener('canplay', playerMediaPlayable);
player.addEventListener('canplaythrough', playerMediaPlayable);

希望有帮助！

HTML5音频：同时使用oncanplay和oncanplaythrough事件获取音频

1 个答案: