html_entities в JavaScript

Question

Здесь у меня есть текстовое поле, в котором пользователь вводит HTML-теги, такие как <h1>hello</h1>, затем я добавляю этот текст к тд с

 var text = $('textbox').val();
 $('table').append('<tr><td style="padding:0px 12px;color:black">'+(text)+'</td></tr>');

Теперь то, что я хочу, - это текст в тд должен прийти текст как введено <h1>hello</h1>, а не привет с тегом h1

Я пытался сбежать и вырваться, но это не помогло

Answer 1

Используемая здесь функция кодирования HTML-кодировка теряется при чтении атрибута из поля ввода

function htmlEncode(value){
  return $('<div/>').text(value).html();
}

 var text = htmlEncode($('textbox').val());
 $('table').append('<tr><td style="padding:0px 12px;color:black">'+(text)+'</td></tr>');

Answer 2

Вот простая функция JavaScript без перерасхода jQuery:

function htmlEncode(str) {
    return str.replace(/[<>&"']/g, function($0) { return "&" + {"<":"lt",">":"gt","&":"amp",'"':"quot","'":"#39"}[$0] + ";"; });
}

Это ищет любое вхождение <, >, &, " и ', вызывает функцию, которая затем ищет соответствующий символ и возвращает ссылку на соответствующий символ.

Answer 3

PHPJS является отличным ресурсом для такого рода "Как я могу использовать эту функцию PHP в Javascript?"вопросы.

Javascript htmlentities ()

Answer 4

если вы хотите html_entities ....

попробуйте проект phpjs

https://github.com/kvz/phpjs/blob/master/functions/strings/htmlentities.js

.. он также требует эту функцию, хотя https://github.com/kvz/phpjs/blob/master/functions/strings/get_html_translation_table.js

Answer 5

Вам необходимо установить значение узла с помощью метода val () :

// Untested
var text = $('textbox').val();
var tr = $('<tr><td style="padding:0px 12px;color:black"></td></tr>');
tr.find("td").val(text);
$('table').append(tr);

Answer 6

Вы можете попробовать заменить <на & lt; и> на & gt;

var text = $('textbox').val();
text = text.replace(/</g,'&lt;').replace(/>/g,'&gt;');
$('table').append('<tr><td style="padding:0px 12px;color:black">'+(text)+'</td></tr>');

Вы можете проверить это сами здесь: http://jsfiddle.net/W7RWA/