如何在HTML和JavaScript中点击提交按钮后显示文本输入内容

你代码里的核心错误是错误获取了按钮的value值，按钮本身没有用户输入的内容，所以点击后无法显示输入框里的信息。只需要修改一行代码就能解决：

修正后的完整代码：

<label for="moveData">Enter data</label>
<input type="text" id="moveData" name="moveData"><br>
<button id="btn" type="button">Move the data</button>
<script>
    document.getElementById("btn").onclick = function()
    {
        // 改为获取输入框（id为moveData）的value值
        var input = document.getElementById("moveData").value;
        document.getElementById("p1").innerHTML = input;
    }
</script>
<p id="p1"></p>

额外优化建议 #

如果希望更安全地显示纯文本（避免用户输入的HTML代码被解析执行），可以把innerHTML换成textContent：

document.getElementById("p1").textContent = input;

内容的提问来源于stack exchange，提问作者Hiro