localstorage实现网页状态记录比如放音乐功能的实例

Posted 叫我星宇

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了localstorage实现网页状态记录比如放音乐功能的实例相关的知识,希望对你有一定的参考价值。

 1 <div class="music">
 2     <a href="javascript:;" onclick="playPause();">
 3     <i class="icon-music open" num="1"></i>
 4     <i class="music-span"></i>
 5     <audio id="aud" src="__STATIC_HOME__/bgmusic.mp3"  loop="loop" autoplay="autoplay"></audio>
 6     <div class="music_text"></div>
 7     </a>
 8 </div>
 9 <script type="text/javascript">
10     var myAudio = document.getElementById(‘aud‘);
11      //播放音乐
12     var storage = window.localStorage;
13     var open = storage.getItem("open") || 1;
14     if(open ==1 ){
15         myAudio.play();
16     }else{
17         myAudio.pause();
18     }
19     function playPause(){
20         if(myAudio.paused){
21             myAudio.play();
22             storage.setItem("open",1);
23         }else{
24             myAudio.pause();
25             storage.setItem("open",0);
26         }
27     }
28 </script>

 

以上是关于localstorage实现网页状态记录比如放音乐功能的实例的主要内容,如果未能解决你的问题,请参考以下文章

javaScript中的Cookie和web Storage(LocalStorage-SessionStorage)详解

刷新页面后怎么让js定时器继续刷新前的状态继续计时

怎样让html滚动字幕初始状态为停止 ,打开网页不动, 鼠标放上开始动, 鼠标离开就停止

微信小程序音乐播放器怎么使用网页音乐

html如何实现多首背景音乐轮流循环播放?

将背景音乐添加到网页