在 display:block 之后隐藏 "shot"

Question

function increase() 
{ 
var counter = parseInt(document.getElementById("counter").innerHTML);
counter--; 
var add = counter -1;
document.getElementById("counter").innerHTML = counter;

// 显示一个元素 document.getElementById("shot").style.display = "block";

我按下了一个显示 "shot" 的按钮，但我希望它在我松手时再次关闭。

Answer 1

如果要隐藏元素，只需使用display:none :

// Hide your element
document.getElementById("shot").style.display = "none";

Answer 2

如果您希望元素在您松开按钮时隐藏，您应该像这样使用 onmouseup 事件：

编辑：将输入标签重新排序到上方，以便在隐藏文本段落时它不会移动**

<!DOCTYPE html>
<html>
<body>
<input type="button" onmousedown="show()" onmouseup="hide()" 
<p id="elem">Some text here.Some text here.Some text here.Some text here.Some text here.</p>
value="Toggle">
<script>
    function show() {
        var elem = document.getElementById('elem');
        elem.style.display = 'block';
    }

    function hide() {
        var elem = document.getElementById('elem');
        elem.style.display = 'none';
    }


    </script>
</body>
</html>

在 display:block 之后隐藏 "shot"

Hide "shot" after display:block

html

javascript

css

display