我有一个将变量加 1 的按钮，但我想在用户单击它后隐藏该按钮以阻止他们添加多个。该按钮要么不隐藏，要么不添加。请帮忙。我尝试了一些东西，但没有任何效果，它是同样的问题，一个或另一个都有效，但从来没有。
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"></script>
<script>
var num = 1;
window.addEventListener("load", function() { // on page loade
document.getElementById("join").addEventListener("click", function(event) {
num++;
show()
})
show(); // first time
})
const pad = (num, howMany, what) => (Array(howMany).join(what) + num).slice(-howMany);
function show() {
document.getElementById('followers').innerHTML = pad(num, 10, "0")
}
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(".btn1").click(function(){
$(this).hide();
});
});
</script>
</head>
<body>
<div class="counter-wrap">
<div id="followers" class="counter">0,000</div>
<div class="measure-wrap">
<span class="text-uppercase letter-spacing" style="top: 4px;">People</span>
</div>
</div>
<div id="idid">
TEst
<p>This is a paragraph.</p>
</div>
<button id="btn" class="button button2 btn1">Hide</button>
</body>
<style type="text/css">
.button {
opacity: 1;
display: block;
margin-left: auto;
margin-right: auto;
width: 25%;
border-radius: 30px;
text-align: center;
text-decoration: none;
background-color: #1D1D1D;
border: none;
color: white;
padding: 15px 42px;
font-size: 25px;
cursor: pointer;
outline: none;
}
.button2 {
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
}
.button:active {
background-color: #080808;
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
transform: translateY(4px);
}
慕姐8265434
相关分类