Javascript в html - Использование одинарной кавычки внутри другой одинарной кавычки

document.getElementById("img").innerHTML="< img src='/sitepath/"+imgg+".jpg' width='72' height='44' onclick='alert('hello');' />";

Приведенный выше код - это мой javascript. Проблема заключается в выводе приветствия или любой другой строки. Если я просто наберу 123 вместо приветствия, он выдаст предупреждение. Но я не могу использовать такую ​​строку, как "привет". Обычно строка в функции предупреждения хранится в кавычках '', но все содержимое заключено в двойные кавычки, и я уже использовал одинарные кавычки в начале функции onclick. Я пробовал использовать escape-символ ("\"), но это не помогло. Какие-либо предложения?


person Ashish Nair    schedule 08.01.2010    source источник
comment
Почему бы тебе не выбрать здесь правильный ответ?   -  person Kristopher    schedule 22.05.2014


Ответы (7)


Попробуй это:

document.getElementById("img").innerHTML = '<img src="/sitepath/' + imgg + '.jpg" width="72" height="44" onclick="alert(\'hello\');" />';
person Darin Dimitrov    schedule 08.01.2010

Если вы используете апострофы в качестве разделителя для атрибутов HTML, вы должны кодировать HTML апострофы, которые вы помещаете внутри атрибута:

document.getElementById("img").innerHTML="< img src='/sitepath/"+imgg+".jpg' width='72' height='44' onclick='alert(&#39;hello&#39;);' />";

Я предпочитаю использовать апострофы в качестве разделителей строк в Javascript и кавычки в качестве разделителей для атрибутов HTML. Затем вы просто избегаете апострофов, которые у вас есть внутри строки Javascript:

document.getElementById("img").innerHTML='< img src="/sitepath/'+imgg+'.jpg" width="72" height="44" onclick="alert(\'hello\');" />';

Чтобы поместить любую строку внутри Javascript, внутри атрибута HTML, внутри строки в Javascript, вы выполните:

  • избежать любых разделителей строк в строке
  • HTML кодирует код Javascript
  • избежать любых разделителей строк в строке HTML
person Guffa    schedule 08.01.2010
comment
Это не апострофы: это одинарные кавычки. Апострофы имеют один и тот же символ, но выполняют совершенно другую грамматическую функцию. - person TRiG; 11.05.2010
comment
@TRiG: Да, это апострофы. Если быть точным, это апостроф пишущей машинки. Цитата - это вообще не символ, это текст, который вы помещаете в кавычки, поэтому для правильности вы должны называть его одинарной кавычкой, что немного громоздко и все же не совсем правильно, поскольку это другой символ. Настоящие кавычки (одинарные, двойные и все остальные) являются типографскими символами, а не тем, что используется в Javascript. - person Guffa; 11.05.2010

У вас есть JavaScript внутри HTML внутри JavaScript. Это естественно сбивает с толку. Лучше избегать проблем с перебрасыванием строк при цитировании и экранировании (которые, если ошиблись, могут легко привести к дырам в безопасности при использовании данных, отправленных пользователем), и сделайте это способом DOM:

var img= new Image();
img.src= '/sitepath/'+imgg+'.jpg';
img.width= 72;
img.height= 44;
img.onclick= function() {
    alert('hello');
};
document.getElementById('img').appendChild(img);
person bobince    schedule 08.01.2010

Я пробовал использовать escape-символ ("\"), но это не помогло

Javascript отличается от C #, вы просто используете его дважды за раз, например: alert('We are\\'t going to go')

person MA9H    schedule 06.06.2012

Неважно, одинарные или двойные у вас внешние кавычки. Вы можете экранировать символ внутри внешней строки с помощью обратной косой черты ... \ 'становится' внутри самой строки. Подойдет пример Дарина или Масуда. Но Масуд игнорирует необходимость использования двойных кавычек в качестве внешнего заключения.

person Tracker1    schedule 08.01.2010

что, если кому-то нужно отправить переменную вместо строки «привет»? Что-то вроде этого:

function showContent(toPopulate) { 
      document.getElementById(toPopulate).innerHTML = "<a href='javascript:showOtherContent(*toPopulate*);'>show</a>"
}

function showOtherContent(toPopulate) {...}

Итак, как отправить toPopulate в качестве переменной showOtherContent ()?

Вышеуказанное решается так:

document.getElementById(toPopulate).innerHTML = "<a href='javascript:showOtherContent(\"" + toPopulate + "\");'>show</a>"
person blaise    schedule 13.11.2010

Вам нужно будет использовать двойные кавычки и экранировать их в атрибуте onclick.

document.getElementById("img").innerHTML="&lt;img src='/sitepath/"+imgg+".jpg' width='72' height='44' onclick=\"alert('hello');\" /&gt;";
person Masood Ahmad    schedule 08.01.2010