Как получить значение ввода без браузера, интерпретирующего специальные объекты html?

Есть ли способ в JavaScript или MooTools для получения фактического текста в значении из элемента ввода без браузера, интерпретирующего любые специальные html-адреса? См. Пример, приведенный ниже. Мой желаемый результат:Как получить значение ввода без браузера, интерпретирующего специальные объекты html?

<div id="output"> 
    <p>Your text is: <b>[&lt;script&gt;alert('scrubbed');&lt;/script&gt;]</b></p> 
</div>

Обратите внимание, что это работает, если я типа/копировать <script>alert('scrubbed');</script> непосредственно в поле ввода текста, но терпит неудачу, если я вставляю сразу после загрузки страницы.

<html> 
<head> 
    <meta http-equiv="Content-type" content="text/html; charset=utf-8"> 
    <title>scrubtest</title> 
</head> 
<body id="scrubtest" onload=""> 
    <script type="text/javascript" language="JavaScript" src="/js/mootools-core.js"></script> 

    <input type="text" name="scrubtext" value="&lt;script&gt;alert('scrubbed');&lt;/script&gt;" id="scrubtext"/><br /> 
    <input type="button" value="Insert" onclick="insertText();"/><br /> 

    <input type="button" value="Get via MooTools" onclick="alert($('scrubtext').get('value'));"/><br /> 
    <input type="button" value="Get via JavaScript" onclick="alert(document.getElementById('scrubtext').value);"/><br /> 

    <div id="output"> 
    </div> 

    <script type="text/javascript" charset="utf-8"> 
     function insertText() 
     { 
      var stext = $('scrubtext').get('value'); 
      var result = new Element('p', {html: "Your text is: <b>["+stext+"]</b>"}); 
      result.inject($('output')); 
     } 
    </script> 

</body> 
</html>

источник

2010-04-20 CaptainQwyx

побег & так: &

<input type="text" name="scrubtext" value="&amp;lt;script&amp;gt;alert('scrubbed');&amp;lt;/script&amp;gt;" id="scrubtext"/>

источник

2010-04-20 21:02:26

В то время как это действительно работает, мне не кажется, что мне нужно «дезинфицировать» текст, который уже был подвергнут санации один раз. Значение ввода является результатом проверки на стороне сервера (php): $ destination ['transit_time'] = trim (htmlspecialchars (stripslashes ($ destination ['transit_time']), ENT_QUOTES)); Я просто хочу, чтобы он остался дезинфицированным, когда я перемещаю его по документу. – CaptainQwyx

Вы не дезинфицируете его. Вы - HTML, избегающий его. '&' должен быть экранирован для отображения в HTML (браузеры [иногда] прощают и отображают его, даже если вы не кодируете HTML). Это правило. Следуйте за ним. –

Но это именно то, что вы хотите. Когда вы пишете (simpified) '', тогда значение входа ** будет ** '<'. Это вы хотите, чтобы значение было '<', тогда вам нужно сбежать от него до '& lt;'. Это просто, как работает, и в этом нет ничего плохого. – RoToRa

{html: "Your text is: <b>["+stext+"]</b>"}

Это ваша проблема: вы принимаете простую текстовую строку и добавить его в HTML-разметку. Естественно, любые символы < в текстовой строке станут разметкой, и вы даете себе потенциальную уязвимость межсайтового скриптинга на стороне клиента.

Вы можете HTML-бежать, но нет встроенной функции, чтобы сделать это в JS, так что вы должны определить его самостоятельно, например .:

// HTML-encode a string for use in text content or an attribute value delimited by 
// double-quotes 
// 
function HTMLEncode(s) { 
    return s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/"/g, '&quot;'); 
} 

... 

var result = new Element('p', {html: "Your text is: <b>["+HTMLEncode(stext)+"]</b>"});

Однако, как правило, проще в использовании DOM методы для добавления простого текста без беспокойства о хакерстве строк. Я считаю, что Moo бы сделать это следующим образом:

var bold= new Element('b', {text: stext}); 
var result= new Element('p', {text: 'Your text is: '}); 
bold.inject(result);

источник

2010-04-20 21:16:48 bobince

Вы можете изменить & символы в &amp с помощью

var result = new Element('p', {html: "Your text is: <b>["+stext.replace(/&/g,'&amp')+"]</b>"});

Дополнение: Я бы с bobince на пользу, используя свойства DOM узла, вместо инъекции произвольного HTML.

источник

2010-04-20 21:17:14 MasterAM

-1

function htmlspecialchars_decode(text) 
{ 
var stub_object = new Element('span',{ 'html':text }); 
var ret_val = stub_object.get('text'); 
delete stub_object; 
return ret_val; 
}

источник

2013-09-06 01:22:38 user2752712

' delete 'не предполагается работать с именами переменных, но со свойствами объекта (http://stackoverflow.com/questions/7009115/behavior-of-delete-operator-in-javascript) –

Как получить значение ввода без браузера, интерпретирующего специальные объекты html?

ответ

Смежные вопросы