Maybe topic really doesn't explain my problem correctly. I'll try to explain more precise it here.
So I'am having a <textarea>
and <p>
aragraph tags. If I'am entering some text in textarea, and then after button click I insert textarea value into paragraph html. If its text everything is fine, but if it's a hand written html code, its not right, because I don't want browser to parse that html code. Here is some simple example involved jQuery:
$('.some_button').click(function () {
$('p').html($('textarea').val());
});
So how I can insert html code as text to paragraph? T开发者_如何学运维hanks in advance!
You need to escape the HTML:
$('p').html($('textarea').val().replace(/</g,'<').replace(/>/g,'>'));
EDIT: use .text()
instead as already mentioned unless you want to do a manual conversion.
With the text method.
David Dorward answered this already, and I'd have added a comment instead of an answer but wasn't sure the code would show up right, so.. With this
$('.some_button').click(function () {
$('p').text($('textarea').val());
});
and
<input type='button' class='some_button' value='click!'><br>
<textarea>foo<br>foo</textarea>
<p></p>
Clicking the button shows "foo<br>foo" in the paragraph. Is that what you need?
--Addendum--
Ok.. I am only a starting JavaScripter, so not sure how bad this is :-) But the following replaces special characters by their HTML equivalents while replacing linebreaks with a <br>.
<script type="text/javascript">
String.prototype.htmlents = function() {
var trans = {'&':'&', '"':'"', '\'':''', '<':'<', '>':'>'};
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>
Remembered I've had to do something similar before, and still had the htmlents() lying around from that time. Feel free to criticise :-)
精彩评论