單擊時刪除按鈕

Question

我試圖讓我的按鈕在被點擊后刪除自己，因為它不應該被點擊兩次，我想我可能會收到引用錯誤，因為我使用的是在線編譯器。 我也很難改用 jquery，因為它似乎把我寫的其他所有東西都搞砸了。

我查看了大量堆棧溢出頁面，在切換到 jquery 后，它們似乎都沒有出現故障代碼。 我希望有一種方法可以在基本 html 中執行此操作，但如果沒有，我希望有人可以解釋如何進行切換。

 var clicks = 0; var cursor1 = false; var autoclicker = false; //Click Button And Cursor Upgrade document.getElementById("clickMe").onclick = function() { clicks++; if (cursor1 == true) clicks++; document.getElementById('output').innerHTML = clicks; document.getElementById("Cursors").onclick = function() { //PAY UP, PEASANT clicks -= 100; //NO MONEY, NO SERVICE if (clicks < 0) { clicks += 100; alert("You are too poor! Peasant..."); } else if (cursor1 == true) { clicks += 100; alert("You can't do that!") } else { cursor1 = true; alert("You bought an extra cursor!"); } document.getElementById('output').innerHTML = clicks; } } //Autoclicker var delay = 1000; var autoClick1 = false; var autoClick2 = false; var autoClick3 = false; var autoClick4 = false; var autoClick5 = false; var autoClick6 = false; var autoClick7 = false; var autoClick8 = false; var autoClick9 = false; var autoClick0 = false; document.getElementById("AutoClicker").onclick = function() { clicks -= 250; if (clicks < 0) { clicks += 250; alert("You are too poor! Peasant..."); } else if (autoclicker == true) { clicks += 250; alert("You can't do that!"); } else { autoclicker = true; alert("You bought the autoclicker!"); document.getElementById('output').innerHTML = clicks; setInterval(clickIncrement, delay); $("input").remove("AutoClicker"); } } var autoCMax = false; document.getElementById("moreAutoC").onclick = function() { clicks -= 250; if (clicks < 0) { clicks += 250; alert("You are too poor! Peasant..."); } else if (autoCMax == true) { clicks += 250; alert("It's already maxed!"); } else { if (autoClick0 == false) { autoClick0 = true; alert("You bought 1 more autoclicker! Autoclickers:2"); } else if (autoClick0 == true && autoClick1 != true) { autoClick1 = true; alert("You bought 1 more autoclicker! Autoclickers:3"); } else if (autoClick0 == true && autoClick1 == true && autoClick2 != true) { autoClick2 = true; alert("You bought 1 more autoclicker! Autoclickers:4"); } else if (autoClick0 == true && autoClick1 == true && autoClick2 == true && autoClick3 != true) { autoClick3 = true; alert("You bought 1 more autoclicker! Autoclickers:5"); } else if (autoClick0 == true && autoClick1 == true && autoClick2 == true && autoClick3 == true && autoClick4 != true) { autoClick4 = true; alert("You bought 1 more autoclicker! Autoclickers:6"); } else if (autoClick0 == true && autoClick1 == true && autoClick2 == true && autoClick3 == true && autoClick4 == true && autoClick5 != true) { autoClick5 = true; alert("You bought 1 more autoclicker! Autoclickers:7"); } else if (autoClick0 == true && autoClick1 == true && autoClick2 == true && autoClick3 == true && autoClick4 == true && autoClick5 == true && autoClick6 != true) { autoClick6 = true; alert("You bought 1 more autoclicker! Autoclickers:8"); } else if (autoClick0 == true && autoClick1 == true && autoClick2 == true && autoClick3 == true && autoClick4 == true && autoClick5 == true && autoClick6 == true && autoClick7 != true) { autoClick7 = true; alert("You bought 1 more autoclicker! Autoclickers:9"); } else if (autoClick0 == true && autoClick1 == true && autoClick2 == true && autoClick3 == true && autoClick4 == true && autoClick5 == true && autoClick6 == true && autoClick7 == true && autoClick8 != true) { autoClick8 = true; alert("You bought 1 more autoclicker! Autoclickers:10"); } else if (autoClick0 == true && autoClick1 == true && autoClick2 == true && autoClick3 == true && autoClick4 == true && autoClick5 == true && autoClick6 == true && autoClick7 == true && autoClick8 == true && autoClick9 != true) { autoClick9 = true; alert("You bought 1 more autoclicker! Autoclickers:11"); autoCMax = true; } else { alert("It's already maxed!") } if (autoClick0 == true) setInterval(clickIncrement, delay); if (autoClick1 == true) setInterval(clickIncrement, delay); if (autoClick2 == true) setInterval(clickIncrement, delay); if (autoClick3 == true) setInterval(clickIncrement, delay); if (autoClick4 == true) setInterval(clickIncrement, delay); if (autoClick5 == true) setInterval(clickIncrement, delay); if (autoClick6 == true) setInterval(clickIncrement, delay); if (autoClick7 == true) setInterval(clickIncrement, delay); if (autoClick8 == true) setInterval(clickIncrement, delay); if (autoClick9 == true) setInterval(clickIncrement, delay); } } //code buffs function clickIncrement() { clicks++; } function sleep(milliseconds) { var start = new Date().getTime(); for (var i = 0; i < 1e7; i++) { if ((new Date().getTime() - start) > milliseconds) { break; } } } function display() { document.getElementById('output').innerHTML = clicks; }

 <!doctype html> <html> <head> <title>Cookie Clicker (WIP)</title> <script> //alert("Please click the cookie first as there is an issue with a segment of the code. Do not hack. It makes the game not fun."); </script> </head> <body> <input class="tooltip" id="clickMe" type="image" src="" onclick="doFunction();" /> <br> <h2>Clicks:</h2> <p id="output"></p> <h2 align="center">Perks</h2> <input title="Doubles Mouse Clicks Cost:250" class="tooltip" id="Cursors" type="image" src="" width="150" onclick="doFunction();" /> <br> <h2>Items</h2> <input id="AutoClicker" title="Buy The Autoclicker For 250 Clicks! Clicks once every second!" type="image" src="https://www.macupdate.com/images/icons256/50547.png" width="150" onclick="doFunction();" /> <br> <h2>Item Upgrades:</h2> <input id="moreAutoC" type="image" src="" title="More Autoclickers! (MAX:11)" onclick="doFunction();" /> </body> </html>

我以為它會立即使按鈕消失，然后就結束了。 我不知道還會涉及其他事情。 注意：所有 src 標簽都被刪除，因為它們很長。

Answer 1

如果你想刪除按鈕而不是隱藏它，沒有 jquery，你將使用來自onclick處理程序的event參數；

event.target.parentNode.removeChild(event.target);

Answer 2

將按鈕的 id 作為示例 id="btn" 點擊下面的代碼

並使用以下代碼

function hide(){
   document.getElementById("btn").style.display = "none";
}

Answer 3

你的問題有點不清楚，代碼很多，不清楚你要刪除哪個按鈕。 因此，我會給你一個通用的答案，希望你能夠申請。

 //Will just hide the button document.getElementById("willHide").addEventListener("click", function(event){ event.target.style.display = "none"; }); //Will remove the button from the DOM entirely document.getElementById("willDelete").addEventListener("click", function(event){ event.target.parentNode.removeChild(event.target); }); //Will disable the button document.getElementById("willDisable").addEventListener("click", function(event){ event.target.disabled = true; });

 <input type="button" id="willHide" value="I will be hidden" /> <input type="button" id="willDelete" value="I will be deleted" /> <input type="button" id="willDisable" value="I will be disabled" />