html5 video怎么停止播放视频-html教程-PHP中文网

首页

web前端

html教程

html5 video怎么停止播放视频

青灯夜游

May 20, 2021 pm 04:30 PM

html5 video

html5 video停止播放视频的方法：首先使用“document.getElementById("id值")”获取到video对象；然后使用“video对象.pause()”语句停止（暂停）当前播放的视频即可。

html5 video怎么停止播放视频

本教程操作环境：windows7系统、HTML5&&javascript1.8.5版、Dell G3电脑。

html5 video停止播放视频

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
</head>
<body> 

<div style="text-align:center"> 
  <button onclick="playPause()">播放/暂停</button> 
  <br><br>
  <video id="video1" width="420">
    <source src="mov_bbb.mp4" type="video/mp4">
    <source src="mov_bbb.ogg" type="video/ogg">
    您的浏览器不支持 HTML5 video 标签。
  </video>
</div> 

<script> 
var myVideo=document.getElementById("video1"); 

function playPause()
{ 
	if (myVideo.paused) 
	  myVideo.play(); 
	else 
	  myVideo.pause(); 
} 
</script> 

</body> 
</html>

效果图：

相关函数说明：

play() 方法开始播放当前的音频或视频。

pause() 方法停止（暂停）当前播放的音频或视频。

更多编程相关知识，请访问：编程视频！！

以上是html5 video怎么停止播放视频的详细内容。更多信息请关注PHP中文网其他相关文章！

本站声明

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

热AI工具

热工具

热门话题

PHP教程

1535

276

显示更多

Related knowledge

什么是HTML5数据属性？ Aug 06, 2025 pm 05:39 PM

HTML5dataattributesarecustom,validHTMLattributesusedtostoreextrainformationinelementsforJavaScriptorCSS.1.Theyaredefinedasdata-*attributes,likedata-user-id="123".2.Theyallowembeddingprivate,customdatadirectlyinmarkupwithoutaffectinglayoutor

HTML5中支持的音频格式是什么？ Aug 05, 2025 pm 08:29 PM

HTML5音频格式支持因浏览器而异，最常用格式包括：1.MP3（.mp3，audio/mpeg，所有主流浏览器均支持，兼容性最佳）；2.WAV（.wav，audio/wav，支持较好但文件大，适合短音频）；3.OGG（.ogg/.oga，audio/ogg，Chrome、Firefox、Opera支持，Safari和IE不支持，开源免费）；4.AAC（.aac/.m4a，audio/aac，Safari、Chrome、Edge支持，Firefox支持有限，常用于苹果设备）。为确保兼容性，应在标签

如何将帆布API用于HTML5中的基本图？ Aug 07, 2025 am 07:15 AM

要使用HTML5CanvasAPI进行基本绘图，首先在HTML中创建canvas元素并设置宽高属性，然后通过JavaScript获取其2D渲染上下文；1.使用fillRect、strokeRect和clearRect绘制和清除矩形；2.通过beginPath、moveTo、lineTo和closePath创建路径并绘制线条或自定义形状；3.利用arc方法绘制圆形或弧线；4.使用fillText和strokeText添加填充或描边文本；5.通过设置fillStyle、strokeStyle、lin

HTML5中的Doctype是什么？ Aug 06, 2025 am 01:15 AM

是HTML5中用于声明文档类型的必要标记，必须位于文档最开始处；其作用是确保浏览器以标准模式渲染页面，避免因缺少声明导致的兼容性问题；该声明简洁、不区分大小写且无需引用DTD；正确使用可保证HTML、CSS和JavaScript的预期行为。

如何创建简单的HTML5网页 Aug 12, 2025 am 11:51 AM

创建一个简单的HTML5网页需要先使用声明文档类型，接着构建包含、和的基本结构，其中内设置字符编码、视口和标题，内添加可见内容如标题、段落、链接、图片和列表，保存为.html文件后即可在浏览器中直接打开查看，无需服务器支持，这是一个完整且有效的HTML5页面的基础。

HTML5中的可读性属性是什么？ Aug 08, 2025 am 11:55 AM

ThereadonlyattributeinHTML5makesforminputsnon-editablewhilestillallowingsubmissionanduserinteraction;1.Itappliestoandelements;2.Itisabooleanattribute,soonly"readonly"needstobepresent;3.Unlike"disabled",itallowsfocusandthedataisinc

HTML5中的局部元素是什么？ Aug 12, 2025 pm 04:37 PM

thelementshouldshouldsbousedforcontenttangentytothemaincontent，SustAssidebars，pullquotes，定义，广告，orrelelatedLinks; 2. ItcanbeplectlaceDinSideSideRoutsIdeAnartIcleDeAlticleDepledePonconTeptOncontendementement; 3.Seasemanticemanticelementthatenhancesacaccccccccccccccccceedibilityancibilityandseobypyandseobyp.Anderancebyp.And.anceScebibilibilyandseobyp

如何以HTML5形式创建彩色选择器？ Aug 08, 2025 am 03:48 AM

使用type="color"可创建HTML5颜色选择器，1.使用添加颜色输入；2.可通过value属性设置默认颜色值（必须为7字符十六进制格式如#ffffff）；3.现代浏览器均支持，旧版浏览器会回退为文本输入；4.可结合JavaScript实时预览颜色变化；5.应添加label标签以提升可访问性，必要时可用JavaScript库提供降级支持，该方法简单有效且广泛支持。

See all articles

html5 video怎么停止播放视频

热AI工具

Undress AI Tool

Undresser.AI Undress

AI Clothes Remover

Clothoff.io

Video Face Swap

热门文章

热工具

记事本++7.3.1

SublimeText3汉化版

禅工作室 13.0.1

Dreamweaver CS6

SublimeText3 Mac版

热门话题