Question

也许话题真的无法正确解释我的问题。我会试着在这里更准确地解释一下。所以我有一个<textarea>和<p> aragraph标签。如果我在textarea中输入一些文本，然后在按钮后单击我将textarea值插入到段落html中。如果它的文本一切都很好，但如果它是一个手写的HTML代码，它不对，因为我不希望浏览器解析那个HTML代码。这是一个涉及jQuery的简单示例：

$('.some_button').click(function () {
$('p').html($('textarea').val());
});

那么如何将html代码作为文本插入段落？提前谢谢！

Answer 1

您需要转义HTML：

$('p').html($('textarea').val().replace(/</g,'&lt;').replace(/>/g,'&gt;'));

编辑：使用.text()代替已经提到的，除非您想进行手动转换。

Answer 2

使用text方法。

Answer 3

David Dorward已经回答了这个问题，我已经添加了评论而不是答案，但不确定代码会显示正确，所以...... 有了这个

$('.some_button').click(function () {
  $('p').text($('textarea').val());
});

和

<input type='button' class='some_button' value='click!'><br>
<textarea>foo&lt;br&gt;foo</textarea>
<p></p>

单击该按钮会在段落中显示“foo＆lt; br＆gt; foo”。这就是你需要的吗？

- 增编 -

好的..我只是一个初学的JavaScripter，所以不确定这有多糟糕:-) 但是，以下替换特殊字符的HTML等价物，同时用＆lt; br＆gt;替换换行符。

<script type="text/javascript">
String.prototype.htmlents = function() {
  var trans = {'&':'&amp;', '"':'&quot;', '\'':'&#039;', '<':'&lt;', '>':'&gt;'};
  var arr = this.split('');
  for (var i=0;i<arr.length;i++) {
    if (trans.hasOwnProperty(arr[i])) {
      arr[i] = trans[arr[i]];
    }
  }
  return arr.join('');
};

$(document).ready(function(){
  $('.some_button').click(function () {
    $('p').html($('textarea').val().htmlents().replace(/\n/g,'<br>\n'));
  });
});
</script>

记得以前我必须做类似的事情，并且从那时起仍然有htmlents（）。随意批评： - ）

将段落html的Textarea值仅作为文本

3 个答案: