Question

我的网页上有一个textarea，用户将输入HTML代码。我想在我的网页上的其他地方显示该HTML代码。我怎么得到这个？

基本上我想做堆栈溢出在他们的问题中所做的事情，询问文本区域，您可以在其中输入强烈的HTML标记，并且在显示文本时它们将显示为 this 。另一个例子是用户可能输入图像标签，我希望该图像显示在网站的另一部分。

我在后端使用Node和Express与MongoDB存储用户输入和ejs模板以显示HTML。

Answer 1

＆＃13;

$("#htmlinput").on("input",function(){
  $("#target").html($(this).val());
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea id="htmlinput"></textarea>
<div id="target"></div>

＆＃13;

Answer 2

以下是我的代码。在我的JS中，我通过使用output属性获取从textarea输入的值并将其显示到id为.innerHTML的div元素。此属性设置或返回元素的HTML内容（内部HTML）。

＆＃13;

function myInput(){
var y = document.getElementById('textarea').value;
  document.getElementById('output').innerHTML = y;    
}

＆＃13;

*{ box-sizing: border-box; }
textarea{ width: 100%; }

#output{
  display:block;
  background:#489ae0;
  color: #fff;
  margin: 0;
  padding: 10px 20px;
  box-sizing: border-box;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <textarea id="textarea" placeholder="please input your texts here" oninput="myInput()"/></textarea>
  <div id="output"></div>

＆＃13;

Answer 3

on js

function write() {
  var text = document.form.input.value;
  return document.getElementById('id').innerHTML = text;
}

on html

<form name="form">
<textarea onkeyup="write()" name="input"></textarea>
<div id="id"></div>
</form>

HTML / Javascript - 如何将输入字段中的文本显示为HTML代码？

3 个答案: