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

Posted 2020-09-26 叫我星宇

 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>