2016-05-23 2 views
0

У меня есть упорядоченный список с классом, названным как комментарии.
Так что я нажимаю значения из моей текстовой области в переменную с именем my_html_syntax.Jquery stop rendering Html синтаксис escape javascript переменная

Код отлично работает, единственная проблема заключается в том, как остановить синтаксис html из рендеринга , например, когда я вхожу в синтаксис html для кнопки, он отображает кнопку в моей ul.

как я избежать моей переменная JavaScript my_html_syntax

РЕШЕННЫЕ -Благодаря Justinas это, как я использовал его.

<html> 

<head> 
<script type="text/javascript" src="https://code.jquery.com/jquery- 2.1.1.min.js"></script> 

<script> 

$(document).ready(function() { 

$('button').click(function() { 
function htmlEntities(str) { 
return String(str).replace(/&/g,'&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;'); 
} 

var my_html_syntax= $('#textarea').val(); 

$('ul').append('<li>' + htmlEntities(my_html_syntax) +'</li>'); 


    }); 
     }); 

</script> 

</head> 
<body> 
<textarea id="textarea" class="textarea" rows="4" cols="50"> </textarea> 

<button class="doit" id="doit" type="button" value="submit"> submit</button> 

<ul class="comments" id="comments"> asd </ul> 

</body> 

    </html> 
+0

Вы можете выполнить 'текст()' на значение, возвращенное 'Валу()', потому что это строка не JQuery объекта. – jcubic

+0

Вы можете использовать регулярное выражение для разметки html как '$ ('# textarea'). Val(). Replace (/ <[^>] +>/g, '')' – jcubic

+0

Возможный дубликат [Экранирование строк HTML с помощью jQuery] (http: //stackoverflow.com/questions/24816/escaping-html-strings-with-jquery) – KeizerBridge

ответ

0

Вы можете избежать HTML объекты, которые будут показаны:

function htmlEntities(str) { 
 
    return String(str).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;'); 
 
} 
 

 
$(document).ready(function() { 
 
    $('ul').append("<li>" + htmlEntities("<a href='example.com'>LINK</a>") + "</li>"); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul></ul>

Source

0

Плохие пути.

Вы должны использовать .text().

$("<li></li>") 
    .text(my_html_syntax) 
    .appendTo($('.comments')); 

Или с .append():

$('.comments').append($("<li></li>").text(my_html_syntax)); 
Смежные вопросы