显示或隐藏通过单击显示的信息

Show or Hide information displayed by click

本文关键字：显示 信息 单击 隐藏      更新时间：2023-09-26

下面是我的代码。它由三个按钮和一个显示屏组成。

<html>
<head>
<script type="text/javascript">

</script>
</head>
<body>
<form name="fun" >
Display Screen<input type="textfield" name="answers" value="">
<br>
<input type="button" value="1" onClick="document.fun.ans.value+='1'">
<input type="button" value="hide">
<input type="button" value="show">

</form>
</body>
</html>

当前，当您按下1时，显示屏上将显示1。我想实现一个功能，这样如果你点击隐藏，然后按1，什么都不会显示。如果按show并按1，则屏幕上将显示1。

可能的方法是，如果你点击隐藏，只禁用1按钮，但我仍然希望用户能够在按下隐藏后点击按钮，只是不显示任何内容。

我是JS的新手，所以如果这是一个糟糕的问题，请原谅。

我会将所有js封装在<script>中，以便能够使用vars。

<script>
    var hide = 0;
    function appendChar(){
        if(hide==0){
            document.fun.ans.value+='1';
        }
    }
</script>

然后我们必须修改html:

<input type="button" value="1" onClick="appendChar()">
<input type="button" value="hide" onclick="hide=1;">
<input type="button" value="show" onclick="hide=0;">

使用javascript:显示和隐藏元素的示例

<html>
<head>
<script type="text/javascript">

</script>
</head>
<body>
<form name="fun" >
Display Screen<input id="answers" type="textfield" name="answers" value="">
<br>
<input type="button" value="1" onClick="document.fun.ans.value='1'">
<input type="button" value="hide" onclick="hide()">
<input type="button" value="show" onclick="show()">
<script type="text/javascript">
function hide()
{
   document.getElementById("answers").style.display = "none";
}
function show()
{
   document.getElementById("answers").value = '';
   document.getElementById("answers").style.display = "inline-block";
}
</script>

</form>
</body>
</html>
相关文章：