将文本提交到文本框后如何显示上面的文本 HTML

Question

我正在尝试创建一个区域，您可以在该区域中的文本框中输入文本并将书写的文本显示在 HTML 上方的框中。我是 HTML 的新手，所以非常感谢您的帮助。我画了一幅我想做的美丽的图画。

Answer 1

<!DOCTYPE HTML>
<html>
<head>
<style>

</style>
</head>
<body>
<p id="x"></p><br>
<input id="value"><input type="button" value="submit" onClick="getV()">
<script>
function getV(){document.getElementById("x").innerHTML = document.getElementById("value").value;}
</script>
</html>

Answer 2

处理这种情况的最佳方法是使用 Javascript 或 jQuery，后者是 javascript 的库本身。让我告诉你应该如何在 jQuery

中做到这一点

<script   src="https://code.jquery.com/jquery-3.2.1.min.js"   integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="   crossorigin="anonymous"></script>
<script>
 $(document).ready(function(){
     $("#form-to-be-submitted").click(function(){
         $(".whatever-styling-you-want").html($("#textBox").val());
        });
    });
 
</script>

<div class="whatever-styling-you-want">

</div>
<!-- Your text box and submit button -->
<div>
      <input type="text" id="textBox" placeholder="Please input your text here..."/>
      <input id="form-to-be-submitted" value="submit" type="button"/>
</div>

Javascript的方法也是一样的。无需使用点击功能，而是使用 javascript 的 on 功能和 'click' 事件。希望对您有所帮助。

将文本提交到文本框后如何显示上面的文本 HTML

How do I display text above after submitting it into a textbox HTML

html

form-submit