HTML 如何在单击按钮时打开视频
HTML how to open a video when i click a button
所以我想做到这一点,当我点击我设置的按钮时,背景会变成这个自动播放(带音频)的 mp4 文件,但我对 HTML 还很陌生所以我无法让按钮真正做任何事情。这是我到目前为止的代码,它在正文部分。我试过将 onclick 与 .innerHTML 一起使用(如下例所示),我尝试了不同的变体,但我无法让它工作,我想不出替代方案,所以我我问你们美丽的人
<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>
}
您对引号的使用存在问题。
你不能创建一个带有“”的字符串,然后 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>
问题出在引号和双引号上,这里是固定的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>";
所以我想做到这一点,当我点击我设置的按钮时,背景会变成这个自动播放(带音频)的 mp4 文件,但我对 HTML 还很陌生所以我无法让按钮真正做任何事情。这是我到目前为止的代码,它在正文部分。我试过将 onclick 与 .innerHTML 一起使用(如下例所示),我尝试了不同的变体,但我无法让它工作,我想不出替代方案,所以我我问你们美丽的人
<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>
}
您对引号的使用存在问题。 你不能创建一个带有“”的字符串,然后 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>
问题出在引号和双引号上,这里是固定的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>";