【求助】如何保证当按钮被点击后不能再被点击
这段代码就是当一个页面点击返回会跳转到这个导航页，会通过参数触发相应的动画，而正常情况是希望按照路线走，但是发现开始一切正常，一遍过后发现即使没有触发动画让用户点击的图标也能够跳转，想请求各位这个情况如何解决
程序代码：
function p2(title)
{
var lp=document.querySelector(".lp")
var d=document.querySelector(".d")
var tp=document.querySelector(".tp")
var h=document.querySelector(".h")
var dp=document.querySelector(".dp")
var t=document.querySelector(".t")
var hp=document.querySelector(".hp")
var ll=document.querySelector(".l")
var arr=[lp,tp,dp,hp]
for(var i=0;i<p.length;i++)p[i].style.display="none"
p[2].style.display="block"
if(title=="xi")
{
lp.style.animation="o 2s 10s forwards,fangda 0.5s linear alternate infinite"
d.addEventListener("click",function(){
p3();
return ;
})
}else if(title=="dun")
{
for(var i=0;i<arr.length;i++) arr[i].style.animation=""
tp.style.animation="o 2s 10s forwards,fangda 0.5s linear alternate infinite"
h.addEventListener("click",function(){
p4();
return ;
})
}else if(title=="ha")
{
for(var i=0;i<arr.length;i++) arr[i].style.animation=""
dp.style.animation="o 2s 10s forwards,fangda 0.5s linear alternate infinite"
t.addEventListener("click",function(){
p5();return ;
})
}
else if(title=="tu")
{
for(var i=0;i<arr.length;i++) arr[i].style.animation=""
hp.style.animation="o 2s 10s forwards,fangda 0.5s linear alternate infinite"
ll.addEventListener("click",function(){
p6();return ;
})
}
else if(title=="luo")
{
for(var i=0;i<arr.length;i++) arr[i].style.animation=""
lp.style.animation="o 2s 10s forwards,fangda 0.5s linear alternate infinite"
d.addEventListener("click",function(){
p3();return ;
})
}
else
throw Error("参数错误");
}
