<html>
<head>
<style>
.inactiveLink {
pointer-events: none;
cursor: default;
}
</style>
</head>
<body>
<p> You have won a prize. Click <a href="https://www.google.com/" target="_blank">here</a> within <div id='clock'></div> seconds ...</p>
<script>
var time = 10;
var f = function counttime(){document.getElementById('clock').innerHTML--;}
function stoptime(){cleatInterval(f);}
if(time){
document.getElementById('clock').innerHTML = time;
var h = setInterval(f,1000);
setTimeout(function(){clearInterval(h);
document.getElementById('clock').innetHTML = "Time's up!";
}, time*1000);
}
</script>
</body>
</html>
我正在尝试创建一个基本网页,打开时会显示“您赢得了奖品。请在 10 秒内单击此处……”。您有 10 秒的时间点击“此处”领取奖品。 10 秒后,“此处”应该无法点击。我添加了一个关于不可点击的 CSS 部分,称为“inactiveLink”。我不知道我应该如何在 10 秒后将 anchor 标记更改为 JS。 (我在考虑 10 秒后,HTML 中的 a 应该更改为 ID 为 inactiveLink 的 a)
最佳答案
你快到了:)
我会使用一个使用 CSS 规则 pointer-events: none
的类,然后在 10 秒后使用 JS 将该类添加到链接中:
const a = document.getElementById('a');
setTimeout(() => a.className = 'unclickable', 10000);
.unclickable { pointer-events: none; }
<a id="a" href="">Hurry up</a>
关于javascript - 如何在 10 秒后使 anchor 不可点击?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59144851/