Escape-кавычки в JavaScript - PullRequest
Новая
       85

Escape-кавычки в JavaScript

198 голосов
/ 05 января 2010

Я вывожу значения из базы данных (она на самом деле не открыта для публичного ввода, но она открыта для ввода пользователем в компании - значит, меня не волнует XSS .)

Я пытаюсь вывести тег, подобный этому: 

<a href="" onclick="DoEdit('DESCRIPTION');">Click Me</a>

ОПИСАНИЕ - это значение из базы данных, которое выглядит примерно так: 

Prelim Assess "Mini" Report

Я пытался заменить «на \», но независимо от того, что я пытаюсь, Firefox продолжает обрезать мой JavaScript-вызов после пробела после слова Assess , и это вызывает все виды проблем.

Я, должно быть, отказываюсь от очевидного ответа, но я не могу понять его жизнь.

Кто-нибудь хочет указать на мой идиотизм?

Вот вся HTML-страница (в конечном итоге это будет ASP.NET страница, но для решения этой проблемы я удалил все остальное, кроме кода проблемы) 

<html>
    <body>
        <a href="#" onclick="DoEdit('Preliminary Assessment \"Mini\"'); return false;">edit</a>
    </body>
</html>

Ответы [ 13 ]

197 голосов
/ 05 января 2010

Вам нужно экранировать строку, которую вы записываете в DoEdit, чтобы очистить символы двойной кавычки. Они приводят к преждевременному закрытию атрибута onclick HTML.

Использование escape-символа JavaScript, \, недостаточно в контексте HTML. Вам необходимо заменить двойные кавычки на правильное представление сущности XML, &quot;.

88 голосов
/ 18 сентября 2012

&quot; будет работать в этом конкретном случае, как предлагалось до меня, из-за контекста HTML.

Однако, если вы хотите, чтобы ваш код JavaScript был независимо экранирован для любого контекста, вы можете выбрать нативную кодировку JavaScript:
' становится \x27
" становится \x22

Таким образом, ваш клик станет:
DoEdit('Preliminary Assessment \x22Mini\x22');

Это будет работать, например, также при передаче строки JavaScript в качестве параметра другому методу JavaScript (alert() - это простой метод тестирования для этого).

Я имею в виду повторяющийся вопрос переполнения стека, Как мне избежать строки внутри кода JavaScript внутри обработчика onClick? .

33 голосов
/ 05 января 2010 
<html>
    <body>
        <a href="#" onclick="DoEdit('Preliminary Assessment &quot;Mini&quot;'); return false;">edit</a>
    </body>
</html>

Должен сделать свое дело.

23 голосов
/ 25 июля 2011

Люди, в JavaScript уже есть функция unescape, которая выполняет эскалацию для \": 

<script type="text/javascript">
    var str="this is \"good\"";
    document.write(unescape(str))
</script>
12 голосов
/ 05 января 2010

Проблема в том, что HTML не распознает escape-символ. Вы можете обойти это, используя одинарные кавычки для атрибута HTML и двойные кавычки для щелчка. 

<a href="#" onclick='DoEdit("Preliminary Assessment \"Mini\""); return false;'>edit</a>
6 голосов
/ 31 мая 2016

Вот как я это делаю, в основном str.replace(/[\""]/g, '\\"'). 

var display = document.getElementById('output');
var str = 'class="whatever-foo__input" id="node-key"';
display.innerHTML = str.replace(/[\""]/g, '\\"');

//will return class=\"whatever-foo__input\" id=\"node-key\"
<span id="output"></span>
2 голосов
/ 04 января 2012

Если вы собираете HTML в Java, вы можете использовать этот полезный служебный класс из Apache commons-lang, чтобы правильно выполнить все экранирование:

org.apache.commons.lang.StringEscapeUtils
Escape и unescapes Строки для Java, Java Script, HTML, XML и SQL.

1 голос
/ 03 апреля 2017

Пожалуйста, найдите в приведенном ниже коде, который экранирует одинарные кавычки как часть введенной строки с использованием регулярного выражения. Он проверяет, является ли введенная пользователем строка разделенной запятой, и в то же время он даже экранирует любые одиночные кавычки, введенные как часть строки. Чтобы избежать одиночной кавычки, просто введите обратную косую черту, а затем одинарную кавычку, например: \ ’ как часть строки. Я использовал валидатор JQuery для этого примера, который вы можете использовать в соответствии с вашей перевозкой.

Примеры допустимых строк:

'Hello'

«Привет», «Мир»

'Hello', 'Мир'

«Привет», «Мир», «1013»

«Это мой мир», «Не могу наслаждаться этим без меня», «Добро пожаловать, Гость»

HTML: 

<tr>
    <td>
        <label class="control-label">
            String Field:
        </label>
        <div class="inner-addon right-addon">
            <input type="text" id="stringField" 
                   name="stringField"
                   class="form-control"
                   autocomplete="off"
                   data-rule-required="true"
                   data-msg-required="Cannot be blank."
                   data-rule-commaSeparatedText="true"
                   data-msg-commaSeparatedText="Invalid comma separated value(s).">
        </div>
    </td>

JavaScript: 

    /**
 * 
 * @param {type} param1
 * @param {type} param2
 * @param {type} param3
 */
jQuery.validator.addMethod('commaSeparatedText', function(value, element) {

    if (value.length === 0) {
        return true;
    }
    var expression = new RegExp("^((')([^\'\\\\]*(?:\\\\.[^\'\\\\])*)[\\w\\s,\\.\\-_\\[\\]\\)\\(]+([^\'\\\\]*(?:\\\\.[^\'\\\\])*)('))(((,)|(,\\s))(')([^\'\\\\]*(?:\\\\.[^\'\\\\])*)[\\w\\s,\\.\\-_\\[\\]\\)\\(]+([^\'\\\\]*(?:\\\\.[^\'\\\\])*)('))*$");
    return expression.test(value);
}, 'Invalid comma seperated string values.');
1 голос
/ 05 января 2010

Я сделал образец, используя jQuery 

var descr = 'test"inside"outside';
$(function(){
   $("#div1").append('<a href="#" onclick="DoEdit(descr);">Click Me</a>');       
});

function DoEdit(desc)
{
    alert ( desc );
}

И это работает в Internet Explorer и Firefox.

0 голосов
/ 25 июня 2019

Вы можете скопировать эти две функции (перечислены ниже) и использовать их для экранирования / удаления всех кавычек и специальных символов. Для этого вам не нужно использовать jQuery или любую другую библиотеку. 

function escape(s) {
return ('' + s) 
    .replace(/\\/g, '\\\\') 
    .replace(/\t/g, '\\t') 
    .replace(/\n/g, '\\n')
    .replace(/\u00A0/g, '\\u00A0') 
    .replace(/&/g, '\\x26') 
    .replace(/'/g, '\\x27')
    .replace(/"/g, '\\x22')
    .replace(/</g, '\\x3C')
    .replace(/>/g, '\\x3E');
 }

function unescape(s) {
 s = ('' + s) 
    .replace(/\\x3E/g, '>')
    .replace(/\\x3C/g, '<')
    .replace(/\\x22/g, '"')
    .replace(/\\x27/g, "'")
    .replace(/\\x26/g, '&') 
    .replace(/\\u00A0/g, '\u00A0') 
    .replace(/\\n/g, '\n')
    .replace(/\\t/g, '\t');

  return s.replace(/\\\\/g, '\\');
}
Страница:
...