#javascript
Вопрос:
Содержимое переменной originalText= «В ожидании — Отправлено для первоначального просмотра»; Однако, когда я навожу курсор на div, текст подсказки усекается после дефиса. Я пытался избежать обмана, но он не позволяет мне этого сделать. Он всегда показывает усеченный текст.
$('#study_header').append('<img src="images/Infow.png" class="tooltip" title=' originalText '/>');
Если кто-нибудь знает решение, пожалуйста, дайте мне знать.
После наведения курсора он отображается, как показано ниже, в исходном коде браузера:
<img src="images/Infow.png" class="tooltip" title="amp;nbsp;amp;nbsp;Pending" -="" submitted="" for="" initial="" review ="">
Спасибо.
Комментарии:
1. Ответ кроется в вашем вопросе. Просто сравните
title
атрибут и его значение с другими атрибутами в<img>
теге/строке. Самым безопасным решением было бы использовать.attr()
2. Извините, я не понимаю, что мне нужно для сравнения атрибутов..значение заголовка исходит из переменной
3.
class="tooltip"
ноtitle=Pending - Submitted for Initial Review
— Чего не хватает вtitle
атрибуте? (Но серьезно… Не добавляйте атрибут с помощью объединения строк. Используйте специализированные инструменты, подобные.attr()
тем, которые создают для вас допустимую разметку)4. Я не занимаюсь конкатенацией строк.. значение переменной поступает из JSON.
Ответ №1:
Вы пропускаете кавычки вокруг значения title
атрибута. Вы можете видеть, что он рассматривает слова в originalText
качестве дополнительных атрибутов.
Вы можете решить проблему, изменив:
'...title=' originalText '/>'
чтобы (обратите внимание на добавленные "
отметки):
'...title="' originalText '"/>'
Я говорю, что это «как бы» исправит это, потому что, если originalText
содержит определенные символы (например "
), это снова сломается, так что вам действительно следует бежать originalText
. jQuery предоставляет методы для этого.
В общем случае вы не хотите создавать HTML с помощью простой конкатенации строк, потому что вы столкнетесь с подобными проблемами.