如何通过文本字段输入用户数据,然后在文本字段的正下方显示

How to input user data through a text field, then display immediately below the text field?

本文关键字:文本 字段 然后 下方显示 用户数 何通过 输入 用户 数据      更新时间:2023-09-26

我是Javascript的新手,但基本上我想让用户输入文本,一旦他们点击按钮,就可以在按钮下方输出。这就是我目前所拥有的:

<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>title</title>
    <link rel="stylesheet" href="main.css">
    <script>
    var message = "#";
    $("#message").text(message);
    </script>
</head>
<body>
    <div id="wrapper">
        <var id="message"></var><textarea rows="4" cols="50" placeholder="Enter their post here, exactly word for word." id="post"></textarea></var>
        <button type="button">Submit</button>
        </div>
    </div>
</body>
</html>

$("#button").click(function(){
   var text = document.getElementById("post").value;
   $("#message").html(text);
});

    <div id="wrapper">
    <textarea rows="4" cols="50" placeholder="Enter their post here, exactly word for word." id="post"></textarea>
    <button id="button" type="button">Submit</button>
    </div>
    <span id="message"></span>

结果:http://jsfiddle.net/YoshiMaster/1r177khr/4/

这没有jQuery。

向按钮添加一个id,并创建id为'textDiv'的空文本区域,然后尝试此操作。

<script type="text/javascript">
         var button = document.getElementById('button_ID');
         button.addEventListener('click',showText);
         function showText() {
             document.getElementById('textDiv').innerHTML = 'new text'; 
         }    
</script>