Javascript innerHTML с onclick не работает

Question

У меня есть некоторый AJAX, он вытягивает следующее, которое добавляется к div с использованием innerHTML.

<a href="#" onclick="javascript:document.getElementById('textareax').value += '\r\nTEST';">Add</a>

Затем, когда я нажимаю ссылку "Добавить", он добавляет "ТЕСТ "в textareax.

Если у меня он есть в HTML-документе с самого начала, он работает отлично, но когда я вытаскиваю его, используя AJAX и innerHTML, чтобы добавить его в div ссылка «Добавить» не работает.

Я думаю, что это может быть проблемой, потому что в ней есть javascript, и я просто добавляю ее, используя innerHTML, но не знаю, как решить эту проблему.

Answer 1

\r\n является новой строкой, но уже проанализирован JavaScript . innerHTML будет установлен на:

<a href="#" onclick="javascript:document.getElementById('textareax').value += '
TEST';">Add</a>

, который не работает (синтаксическая ошибка; строки JavaScript не могут иметь буквальные символы новой строки).

Вам нужно было бы дважды экранировать с помощью \\r\\n, чтобы при синтаксическом анализе JavaScript он стал \r\n (\\ становится \ и r не будет затронут). Тогда \r\n будет сохранен в обработчике onclick, так что новая строка действительно добавляется в текстовую область: http://jsfiddle.net/r6bhE/.

Answer 2

onclick="javascript:document[...] неверный синтаксис.Атрибут onclick является событием javascript и не нуждается в указании схемы javascript.Вы можете просто поместить скрипт непосредственно в значение атрибута:

<a href="#" onclick="document.getElementById('textareax').value += '\r\nTEST';">Add</a>

Также рекомендуется возвращать значение при перехвате событий мыши (true для передачи события, false для его отмены)).