Передача строки с апострофом из PHP в функцию JavaScript

Question

Простая проблема, которую я просто не могу найти «правильный» ответ.

У меня есть PHP-скрипт, который читает имена людей из базы данных и отображает их в виде таблицы. В каждой строке я связал имя человека с функцией JavaScript, которая отображает всплывающее окно с именем человека в качестве заголовка - код PHP и полученный HTML-код следующим образом:

$name = $results['name'];
echo '<a href="javascript:void(0)" onclick="popup(this, '\' . $name . '\')">' . $name . '</a>';

С HTML:

<a href="javascript:void(0)" onclick="popup(this, 'Steve Smith')">Steve Smith</a>

Все работает нормально, кроме случаев, когда я нажимаю на имя с дефисом, такое как "Bryce D'Arnoud", что приводит к апострофу, нарушающему HTML. Чтобы обойти эту проблему, я использую функцию PHP addslashes(), в результате чего получается следующий код & html:

$name = $results['name'];
echo '<a href="javascript:void(0)" onclick="popup(this, '\' . addslashes($name) . '\')">' . $name . '</a>';

С html:

<a href="javascript:void(0)" onclick="popup(this, 'Bryce D\'Arnoud')">Bryce D'Arnoud</a>

Все работает нормально, но по какой-то причине JavaScript не удаляет escape-символ, и в функции popup (), если я выдаю предупреждение по имени, я вижу «Bryce D \ 'Arnoud»

function popup(t, name) {
  alert(name);
}

Какие-нибудь предложения относительно того, где я иду не так?

Answer 1

Во-первых, жизнь была бы намного проще, если бы вы не смешивали JavaScript в своей разметке. Вместо этого используйте PHP-семантическую разметку и обращайтесь к данным с помощью JavaScript:

$name = $results['name'];
echo '<a href="#" class="popup" data-name="' . $name . '">' . $name . '</a>';

И затем получить доступ к значению (я использую jQuery для этого для краткости):

$('.popup').click(function(e) {
    e.preventDefault();

    alert($(this).attr('data-name'));
});

А в родном JS (думаю):

document.getElementsByClassName('popup').onclick = function (e) {
    e = e || window.event;

    e.preventDefault();

    alert(this.getAttribute('data-name'));
};

Answer 2

Не сработает ли избежание двойных кавычек?(не проверено)

echo "<a href=\"javascript:void(0)\" onclick=\"popup(this,'$name')\">$name</a>";

РЕДАКТИРОВАТЬ: Извините за пропущенную точку.Использование preg_replace для замены одинарных кавычек их HTML-сущностями может сделать это, однако.

echo '<a href="javascript:void(0)" onclick="popup(this,\'' . preg_replace("/'/",'&#39;',$name) . "')\">$name</a>";

EDIT 2 На самом деле преобразование всех этих в $name может быть чище:

$name = preg_replace("/'/", ''', $results['name']);
echo "<a href=\"javascript:void(0)\" onclick=\"popup(this,'$name')\">$name</a>";