javascript - 如何在文本框中显示输入的文本?

标签 javascript html css textbox

我想在输入字段中输入文本并将其显示在文本框中。

我觉得很简单。我需要一个 Input 来输入文本,一个按钮和一个文本框来显示我的文本。但是我的代码不起作用。

这是我的代码:

<!DOCTYPE html>
<link rel="stylesheet" href="style.css">

<script type="text/javascript">
function ausgabe(){
  var text=document.getElementById("text");
  var Wiedergabe=document.getElementById("Wiedergabe");
  var Text=text.value;
  Wiedergabe.value=Text
}

</script>
<div class="Webview">

  <div class="message_container" id="myForm" ></div>

  <form class="send_container">
    <input type="text">
    <button type="submit"
    value="Nachricht absenden"
    onclick="ausgabe">

  </form>



</div>


@charset "UTF-8";

.Webview{
  height: 400px;
  width: 300px;
}

.message_container{
  height: 80%;
  width: 100%;
  border:5px solid green;
}

.send_container{
  height: 20;
  width: 100%;
}

.send_container input{
  width: 70%;
  height:20%
  border:2px solid #1CE615;
}

.send_container button{
  width: 30%;
  height:20%;
}

最佳答案

我认为您以某种方式对 id 和命名做了一些误解,您正在尝试访问名称错误的元素 - 解决方案如下:

  <input id="textField" type="text">
  <p>
     <input type="button" id="theButton" value="click me!" 
         onclick="document.getElementById('div').innerHTML = 
         document.getElementById('textField').value" />
  </p>
  <h3><div id="div"></div></h3>

关于javascript - 如何在文本框中显示输入的文本?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59444442/

相关文章:

html - 两个元素并排的问题

javascript - AngularJS - $q 的 Promise 未正确级联到 Controller

javascript - dropzone.js 事件回调对象结构

javascript - Cytoscape.js 标签点击/单击上的节点/边缘标签编辑器

html - 单词上的自定义行

javascript - 具有不同叠加层/工具提示的图像映射

javascript - selectedIndex - Google Chrome 上的 javascript

javascript - Ctrl+V(粘贴)触发 jQuery 的 keyup 函数两次

javascript - javascript 上的 arguments.callee 向下滑动的解决方法

html - CSS Browser hack for ≥ IE10, Index was outside the bounds of the array