关于audio标签设置currentTime属性无效，currentTime变为0

已于 2023-03-24 13:07:31 修改
阅读量4.5k 收藏 1
点赞数
文章标签： javascript html5 html
于 2021-10-17 18:41:49 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/chenjixue/article/details/120728608
版权

audio里面的资源没有预加载，直接设置currentTime会导致currentTime设置无效并且重置为0，

要想手动设置currentTime生效，那么需要设置audio的preload属性auto是使文件预加载

<audio id="audio" src="xxxx.wav" preload="auto" ></audio>

document.getElementById("audio").currentTime = xxx 即可通过js代码控制音频的进度调

chenjixue
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
html5中为audio标签增加停止按钮动作实现方法
12-13
在html 5中的audio标签中，只有暂停按钮，但没有停止按钮，其实为其增加也不麻烦，方法如下： 复制代码代码如下: HTMLAudioElement.prototype.stop = function() { this.pause(); this.currentTime = 0.0; } 其实...
HTML5 AudioVideo 标签,属性,方法,事件
06-14
HTML5 Audio/Video 标签、属性、方法、事件 HTML5 中的 Audio/Video 标签是多媒体内容的基础组件，用于在网页中播放音频和视频内容。今天，我们将深入探讨 HTML5 Audio/Video 标签的各种属性、方法和事件。 ...
【问题记录】audio标签变更currentTime属性值无效，currentTime变为0
taojin12的博客
08-16 1950
项目中使用console 输出的该值，如果在此处只是调用的话并不会生效。项目中对这俩值又没有太多需求，暂时只能这样做了，有好的解决方法的，欢迎大佬指出。在使用audio播放音频中，需要拖动进度条，来使音频可以快进，单纯的使用currentTimes改变属性值，是不会生效的。audio.currentTimes = 100 //这样改变不会生效。该属性可以寻址到音频的中的任何位置，即使该音频没有完成缓冲。可以使用audio中的seekable 属性，来设置。音频中可寻址（移动播放位置）的时间范围。....
audio 设置 currentTime 失效 的解决办法
weixin_33722405的博客
02-04 2345
当服务端返回的 音频文件标示 no-cache 的时候，会引起currentTime 失败。 改掉server 返回头信息。解除禁止缓存，一切ok。 转载于:https://www.cnblogs.com/Mr-Joe/p/4273045.html...
audio组件的currttime值设置失败
最新发布
2301_78459015的博客
05-04 254
在组件的内部加上这条，大概意思就是说在浏览器运行这个页面之前，会先预加载着几个组件，这样浏览器就知晓了这几个组件的存在，也就解决了currenttime属性不存在的问题（纯属个人理解，如有不恰当的地方，求指正）。就是在当我连续敲击的时候，组件并不是连续的播放，原因可能是因为，在我敲击播放第一次之后的再次敲击时，此时的audio组件正处在播放状态中，所以没有达到连续播放的效果。在调用currenttime之前先执行了这样一行代码，最终问题被稀里糊涂的解决了，成功的实现了连续的击鼓。
html5 audio设置currentTime
热门推荐
huxiaoxiao_zero的专栏
04-23 1万+
html5 audio.currentTime值改变需要考虑的情况
解决 iOS HTML ＜audio＞ 标签设置 currentTime 后再获取它的值没有变化
qq1014156094的博客
04-26 1035
问题复现 框架：Vue 组件：@liripeng/vue-audio-player iOS 版本：14.4 注意：this.$refs.audio 是 <audio> 标签实例 当我点击进度条时设置了 currentTime，例如 this.$refs.audio.currentTime = 30，但不执行播放。 点击播放按钮，执行 this.$refs.audio.play() 和 window.setInterval(() => { console.log(this.$refs.a
audio对象或video对象在设置currentTime时不生效，会自动跳转到0
qq953454299的博客
10-11 356
试了网上很多办法，什么设置preload=“auto”，用什么seeked，都不管用。后来发现，不需要，什么额外的操作都不用做，只要别在hbuilder里打开就行。从文件管理器里打开，啥事儿没有，非常完美。
ie11中设置audio的currentTime报错InvalidStateError
dragoo1的专栏
07-27 8159
环境：win7 32位，ie11 要做一个切换歌曲功能：Sspan.on(downEvent, function () { switchTime = au1[0].currentTime; curAudio = (curAudio + 1) % 2; au1.attr("src", audio2[curAudio]); au1[0].play(); au1
HTML5 Video标签的属性、方法和事件汇总介绍
09-28
- `currentTime`: 获取或设置视频当前的播放时间，也可以用作改变播放位置。 - `startTime`: 视频开始播放的时间，通常为0。 - `duration`: 视频的总时长，如果是流媒体可能返回`Infinity`。 - `paused`: 如果视频...
OS_internalsoutces_read_write_currenttime_CodeName_源码
10-04
Write a Java program that will read from internal sources and write the following report:print your name (hard code not from properties)current time and datethe version of Java you are running (java....
CurrentTime_USing_React_hooks:用CodeSandbox创建
03-26
CurrentTime_USing_React_hooks 用CodeSandbox创建
js+audio实现音乐播放器
10-14
进度条可以通过监听`timeupdate`事件和设置`currentTime`属性来同步： ```javascript audio.addEventListener('timeupdate', function() { var progress = (audio.currentTime / audio.duration) * 100; ...
CurrentTime-in-[removed]使用Jumbotron打印当前本地时间
04-07
Javascript中的当前时间使用Jumbotron打印当前本地时间。
解决ios audio无法播放问题
08-28
this.$refs.audio.currentTime = 0 this.$refs.audio.play() ``` 总结来说，在iOS中，如果需要播放音乐或者视频，需要用户手动触发事件在调用.play()才能播放（autoplay或者直接.play()是不能直接触发的）；如果...
html5 audio音频，video视频currenttime设置失效
追梦猪的博客
10-10 2884
今天在做一个音乐播放的插件，遇见了一个currentTime属性无法赋值的问题，我们在（红箭头指向）此进行了赋值但是我们点击播放按钮的时候发现打印的_that.audios.currentTime值一直为0，而从上面的current也是有值的，这样我们想到的是可能是加载音频文件的问题...
HTML audio设置.currentTime而实际播放位置不准确
还是上会网吧～
12-19 206
编码即可，或其他文件格式。
videojs在ios14中直接设置currenttime无效
qq_42727920的博客
03-18 1434
videojs在ios14中直接设置currenttime无效 设置currenttime前先执行load（）方法 这样每次load（）方法执行时都会黑屏 要避免这种情况的话只需在创建实例后（new）执行一次load（）方法即可 我这里遇到的问题是 这里绿色的播放按钮的作用是点击这个按钮就会播放相应的句子且视频会跳转到相应的部分 获取数据中（starttime endtime）这段句子对应的时间刻度并将其设置为视频的currenttime就可以了 这个功能在除了ios14的其他系统都没问题 在ios14
audio标签设置currentTime属性无效
06-07
如果你设置`audio`标签的`currentTime`属性时无效，可能是因为该属性只能在`audio`标签的`loadedmetadata`事件触发之后才能生效。所以，你需要确保在设置`currentTime`属性之前，`audio`标签已经加载了音频数据。你可以在`audio`标签上添加`loadedmetadata`事件监听器，在该事件触发后再进行设置`currentTime`属性。举个例子： ```html <audio src="audio.mp3" id="myAudio"></audio> <script> const audio = document.getElementById('myAudio'); audio.addEventListener('loadedmetadata', () => { audio.currentTime = 10; // 在该事件触发后才设置currentTime属性 }); </script> ``` 注意，如果音频文件比较大，`loadedmetadata`事件可能需要一些时间才能触发，所以你需要确保在设置`currentTime`属性之前，音频已经完全加载完成。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值