HTML,当我单击按钮时如何打开视频

问题描述 投票:0回答:2

所以我想这样做,所以当我单击设置的按钮时,背景将更改为此mp4文件,该文件将自动播放(带有音频),但是我对HTML还是陌生的,所以我无法将按钮实际上什么都做。这是我到目前为止的代码,它在body部分中。我已经尝试过将onclick与.innerHTML一起使用(如下面的示例所示),我尝试了不同的变化,但是我无法使其正常工作,我想不出另一种选择,所以我问你ll美丽的人

<p> Hey, ya like this clock?</p>
<p> Click this button >:)</p>
<input type="button" value="( ͡° ͜ʖ ͡°)" onclick="clicc()">
<script>
function clicc(){
    document.body.innerHTML = "<div class="section">" 
            <video>  
                <source src="ZA WARUDO.mp4" type="video/mp4">  
            </video>
        </div>
}
javascript html mp4
2个回答
0
投票

您使用引号时遇到问题。您不能使用“”创建字符串,然后也使用“”来创建HTML属性。

<html>
<head>
<script>
function clicc(){
 document.body.innerHTML = "<div class='section'><video controls><source src='https://file-examples.com/wp-content/uploads/2017/04/file_example_MP4_480_1_5MG.mp4' type='video/mp4'></video></div>"
}
</script>
</head>
<body>
<p> Hey, ya like this clock?</p>
<p> Click this button >:)</p>
<input type="button" value="( ͡° ͜ʖ ͡°)" onClick="clicc()">
</body>

</html>

检查此演示:https://jsfiddle.net/7pruecmh/5/


0
投票

问题在于引号和双引号,这是固定的js代码位:

<p> Hey, ya like this clock?</p>
<p> Click this button >:)</p>

<input type="button" value="( ͡° ͜ʖ ͡°)" onclick="clicc()">

<script>
function clicc(){
  document.body.innerHTML = "<div class='section'><video source src='ZA WARUDO.mp4' type='video/mp4'></video></div>";
}
</script>

如果要对所有内容都使用双引号,则必须转义那些不用于定义html字符串的引号,而用于定义html元素属性的引号,例如:

document.body.innerHTML = "<div class=\"section\"><video source src=\"ZA WARUDO.mp4\" type=\"video/mp4\"></video></div>";
© www.soinside.com 2019 - 2024. All rights reserved.