Question

我这里有一个工作代码，允许用户输入内容并立即显示输出，但我想创建一个由按钮触发的功能，该功能将清除输出区域本身。这可能与我的代码有关吗？

这是我的完整代码：

<html>
    <meta charset="UTF-8">
    <head>
        <title>Sample Array</title>
        <script>var index = 0;</script>
    </head> 

    <body>


        Input:
        <input type="text" id="input">
        <input type="button" value="GO" onClick="press(input.value)">

        <p id = "display">

        <script>

            var sample = new Array();

            function press(Number)
            {

                if ( Number != '' )
                {
                    sample[index] = Number;
                    document.getElementById("display").innerHTML += sample[index] + "<br>";
                    index++;

                }   

                else
                    alert("empty");

                document.getElementById('input').value = '';        
            }       


        </script>

    </body>
</html>

Answer 1

这样做：

注意：

- 我关闭了P元素。

- 添加了一个新的按钮“Clean”，您可以使用下面显示的JQuery来清理输出（记得在页面中引用JQuery）。

<html>
<meta charset="UTF-8">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <title>Sample Array</title>
    <script>var index = 0;</script>
</head> 

<body>


    Input:
    <input type="text" id="input" />
    <input type="button" value="GO" onClick="press(input.value)"/>
    <input type="button" value="Clean" onClick="$('#display').html('');"/>
    <p id = "display"></p>
    <script>

        var sample = new Array();

        function press(Number)
        {

            if ( Number != '' )
            {
                sample[index] = Number;
                document.getElementById("display").innerHTML += sample[index] + "<br>";
                index++;

            }   

            else
                alert("empty");

            document.getElementById('input').value = '';        
        }       


    </script>

</body>

Answer 2

试试这个，

<强>使用Javascript：

function Clean(){
  document.getElmentById('display').innerHTML='';
}

<强> HTML：

<input type="button" value="Clean" onClick="Clean()"/>

清除输出区域

2 个答案: