WebCat - 在线视频播放器 - 常规

<html>
  <head>
	<meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<title>WebCat</title>
    <style>
      *{
       margin:0;
        padding:0;
       }
      img{
        width:100vw;
       }
     #inp,#oop{
       text-align:center;
       font-size:10vw;
       }
    </style>
    <script src="js/jquery.min.js"></script>
  </head>
  <body>	
	<img src="img/1.jpg" id="img"/>
    <div id="inp">播放视频</div>
    <div id="oop"></div>
 <script>
 let kpo;
 let autoi = 0;
 let isPlaying = false; // 是否正在播放
 const audio = new Audio('mp3/0.mp3');
function bofang(fps) {
  img.src = "img/" + fps + ".jpg";
  $("#inp").text(fps);
  console.log(fps);
}
 inp.onclick=function(){
  if (!isPlaying) { // 如果当前未在播放，则执行以下代码
    $("#oop").text("暂停播放");
    autoi = 1;
    let tyt = 1;
    audio.play();
    setInterval(
    function(){
if(tyt < 1196 && tyt > 0){
      if(autoi == 1){
 bofang(tyt);
 tyt++;
 }else{
 kpo = tyt;
 alert(tyt);
 tyt = -1;
 audio.pause();
 }
}
else{
 if(autoi == 1){
 tyt = 1;
 audio.currentTime = 0;
 audio.play();
  }else{
<p>tyt = -1;
audio.pause();
}
}
;},10);
isPlaying = true; // 标记当前正在播放
}
}</p>
<p>/*
function jixvbf(tyt){
autoi = 1;
audio.play();
setInterval(
function(){if(tyt &lt; 1196 &amp;&amp; tyt &gt; 0){
if(autoi == 1){
bofang(tyt);
tyt++;
}else{
kpo = tyt;
tyt = -1;
audio.pause();
}
}
else{
if(autoi == 1){
tyt = 1;
audio.currentTime = 0;
audio.play();
}else{
kpo = tyt;
tyt = -1;
audio.pause();
}
}
;},10);
}
*/</p>
<p>oop.onclick=function (){
if(autoi == 1){
autoi = 0;
isPlaying = false; // 暂停时重置播放状态
$(&quot;#oop&quot;).text(&quot;继续播放&quot;);
}else{
alert(kpo);
autoi = 1;
$(&quot;#oop&quot;).text(&quot;暂停播放&quot;);
}
}</p>
</script>
  </body>
</html>