为什么我的背景视频会在警报后播放?

时间:2018-03-31 19:35:04

标签: javascript video background alert

目前,我的背景视频只会在用户在警告弹出窗口中按“okay”后播放。如何在窗口出现或页面加载时创建代码以使背景视频播放,而不必从警报中按下确定。 警报出现之前需要播放背景视频。我是javascript的新手,所以我需要代码示例,或者编辑我当前的代码才能正确理解。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
</head>
<body>

<script>

function myText() {
    var txt;
    var person = prompt("What's your name?", "");
    if (person == null || person == "") {
        txt = "User cancelled the prompt.";
    } else {
        txt = "Hello " + person + "! How are you today?";
    }
    document.getElementById("demo").innerHTML = txt;
}

function playAlert(msg, wav) {
    return new Promise(function(resolve) {
        var audio = new Audio(wav);
        audio.addEventListener('canplay', function(e) {
            audio.play();
            alert(msg);
            resolve();
        });
    });
}
window.onload = function() {
        document.getElementById("video");
    };

playAlert("Thank you.", 'Images/thankyou.wav?.wav?.wav?.wav?.wav')
.then(function() {
    return playAlert("Sorry, I haven't introduced myself.", 'Images/sorry.wav?.wav?.wav');
})
.then(function() {
    return myText("My name is Eve. What is your name?", 'Images/mynameiseve.wav?.wav?.wav');
})
.then(function() {
    return playAlert("Can you hear me?", 'Images/canyouhearme.wav?.wav');
});




</script>

<video controls id="video"  width="1300px" height="auto" preload="auto" autoplay="autoplay">
<source src="images/thirdeve.mp4" type="video/mp4"/>
</video>

</body>
</html>

1 个答案:

答案 0 :(得分:0)

如果您的javascript调用了警报,则警报将首先发生。在警报被清除之前别无其他事情发生。