<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>木鱼</title>
<script src="vue.js"></script>
</head>
<body>
<div id="a" style="text-align: center;margin-top: 20%">
<div v-for="it in its" width="100" height="100">
<div style="font-size: 24px;font-style: normal;color:#652f2f;" >功德+{{msg}}</div>
<audio id="music" src="1.mp3" loop autoplay></audio>
<img id="p" :src="it.url" @click="aa">
</div>
</div>
</body>
<script>
var v=new Vue({
el: '#a',
data:{
msg:0,
its: [{
url:"2.png",
}]
},
methods:{
aa(){
this.msg++;``
var msg=document.getElementById("p");
msg.src="1.png";
var music=document.getElementById("music");
music.currentTime=0,
music.play();
setTimeout(f,200);
function f(){
music.pause();
msg.src="2.png";
}
}
}
});
</script>
</html>