使用audio点击播放按钮后，再点切换下一首歌去，之后再点击暂停按钮，就出现点击切换上一首下一首歌曲自动播放的情况而且播放按钮也没有切换。

使用audio点击播放按钮后，再点切换下一首歌去，之后再点击暂停按钮，就出现点击切换上一首下一首歌曲自动播放的情况而且播放按钮也没有切换。
js代码如下：

var index=0;//li初始索引
var li=$(".center ul li")
var img=$(".music_img img");//获取播放器img元素
var text_p=$(".music_text p");//获取播放器music_text中歌曲元素
var text_span=$(".music_text span");//获取播放器music_text中歌手元素
var prev=$(".music_btn .music_prev");//获取播放器上一首a元素按钮
var play=$(".music_btn .music_play");//获取播放器暂停/播放a元素按钮
var next=$(".music_btn .music_next");//获取播放器下一首a元素按钮
var like=$(".music_like img");//获取点赞
let musicOBJ = document.querySelector("audio");//获取audio
var bingo=false;//是否点赞
var flag=false;//歌曲是否播放
var close=false;//播放器是否展开

function show(){
    change_img_text(1+index);
    img_rotate();
    change_btn();
    musicStop();
    musicTime();
    play_mp3();
}
// 更换播放按钮和
function change_btn(){
    play.removeClass("music_play");//移除播放样式
    play.addClass("music_pause");//添加暂停样式
}

// 图片旋转
function img_rotate(){
    img.removeClass("img_rotate");
    img.addClass("img_rotate");
}

//播放音乐
function play_mp3(){
    musicOBJ.src="music/"+(index+1)+".mp3";//获取选中的li的datasrc属性
    musicOBJ.oncanplay=function(){
        nowtime=0;
        musicStop();
        musicTime();
        musicOBJ.play();//播放歌曲

    };
    flag=true;//修改歌曲是否播放的标记
}

//暂停和播放
play.click(function(){
    if(flag){
        musicOBJ.pause();//暂停歌曲
        musicStop();
        img.removeClass("img_rotate");//歌曲图片停止旋转
        play.removeClass("music_pause").addClass("music_play");//暂停按钮变为播放按钮
        flag=false;//修改歌曲是否播放标记
    }else{
        show();
        img.addClass("img_rotate");//歌曲图片开始旋转
        play.removeClass("music_play").addClass("music_pause");//播放按钮变为暂停按钮
        flag=true;//修改歌曲是否播放标记
    }
})

// 切换上一首
prev.click(function(){
    index--;
    if(index<0){
        index=7;
    }
    if(flag){
        change_img_text(index+1);
        musicOBJ.src="music/"+(index+1)+".mp3";
        musicOBJ.oncanplay=function(){
            nowtime=0;
            show();//播放歌曲
        };
    }else{
        change_img_text(index+1);
        musicOBJ.src="music/"+(index+1)+".mp3";
    }

})

//切换下一首
next.click(function(){
    index++;
    if(index>=8){
        index=0;
    }
    if(flag){
        change_img_text(index+1);
        musicOBJ.src="music/"+(index+1)+".mp3";
        musicOBJ.oncanplay=function(){
            nowtime=0;
            show();//播放歌曲
        };
    }else{
        change_img_text(index+1);
        musicOBJ.src="music/"+(index+1)+".mp3";

    }
})

你这样写 还不如 new audio。 api参考https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/audio

在播放歌曲前先将上一首歌曲暂停掉，以免产生自动播放的情况，可以使用musicOBJ.pause()来暂停歌曲，同时也可以在播放歌曲时将播放按钮改变为暂停按钮的样式，以避免出现这种情况，可以使用play.removeClass("music_play").addClass("music_pause")来实现该功能。