Question

如果我在我的网页上有一个文本区域供用户输入文字，我如何将其转换为按钮按下时显示为html，反之亦然？我正在寻找类似wordpress在用户输入文本时会做什么然后将其转换为html或者可以编写html并将其转换为文本的内容。

到目前为止，我尝试了几段代码：

var text_only = $('.snippet').text();

这只显示没有标签的html，这不会像预期的那样呈现html，而其他没有更好的

修正：请参阅链接以获得更好的说明 - http://www.w3schools.com/html/tryit.asp?filename=tryhtml_basic_document

感谢

缺口

Answer 1

你是说这样的意思吗？ http://jsfiddle.net/7crysb0L/2

JS：

$('#dohtml').click(function() {

    var textAreaVal = $('#myTextArea').val();

    $('#myDiv').html(textAreaVal);

});

$('#dotext').click(function() {

    var textAreaVal = $('#myTextArea').val();

    $('#myDiv').text(textAreaVal);

});

html：

<textarea id="myTextArea" placeholder="Type here, then click the button to update the div"></textarea>
<br />

<button id="dohtml">Make HTML</button>
<button id="dotext">Make Text</button>
<div id="myDiv"></div>

这导致两个按钮。单击＆＃34;制作HTML：使用textarea中的HTML填充myDiv，然后单击＆＃34; Make Text＆＃34; - 将textarea的内容视为文本，并使用可见的HTML标记填充div。

值得注意的是，这不是应该在当前状态下使用的代码，除非它只是客户端，因为它很容易插入不安全的值 - 例如，尝试运行JS小提琴，将</textarea><script>alert('lol')</script>插入textarea，然后点击“制作HTML＆＃39;看看为什么....你不想把这样的未经过处理的垃圾保存到某个地方的后端，但如果只是为了演示目的那么它应该没问题。

jQuery html api ref：http://api.jquery.com/html/

Answer 2

var text_only = '&lt;div&gt;' + $('.snippet').text() + '&lt;/div&gt';

这里的小提琴：http://jsfiddle.net/p5hnttga/

jQuery将Html转换为文本并返回

2 个答案: