Question

以下是我的html＆amp; jquery脚本

<textarea id="id"></textarea>
<div class="messages"></div>

当我在textarea中输入内容并按回车键时，它将运行以下脚本

var x = $("textarea#id").val();
$("div.messages").append("<span class='zz'>"+x+"</span>");

它成功运作。

但是当我在textarea中输入html代码时，它只显示输入textarea的html元素
即，当我输入HTML时，它会显示 HTML ，但我需要HTML ..
我知道.text()代替.html()。
但我认为，它不适用于我的代码。
因为应该是一个html元素。

Answer 1

试试这个： -

function escape(text) {
    return text
        .replace(/&/g, "&amp;")
        .replace(/</g, "&lt;")
        .replace(/>/g, "&gt;")
        .replace(/"/g, "&quot;")
        .replace(/'/g, "&#039;");
}

var x = $("textarea#id").val();
$("div.messages").append("<span class='zz'>"+escape(x)+"</span>");

Demo

Answer 2

Xmp标签将其转义

DEMO

$("#div1").html("<span><xmp>" + $("#id").val() + "</xmp></span>");

Answer 3

也可以尝试将值放在pre标记内，这样它就不会被解释为HTML：

$('div.messages').html('<span class="zz"><pre>' + $("#id").val() + '</pre></span>');

然而，预标签内的东西无法设置样式。

Answer 4

为什么每个人都这么复杂？

var x = $("textarea#id").val();
$("<span class='zz'></span>").text(x).appendTo($("div.messages"));

Jquery将HTML代码更改为纯文本

4 个答案: