Вставка перевода строки в атрибут заголовка с использованием javascript / jquery - PullRequest
1 голос
/ 25 сентября 2011

Вопрос:
Мне нужно вставить перевод строки внутри подсказки, чтобы не все в одной строке. Я использую tooltipsy , чтобы генерировать мои подсказки. Он работает с использованием атрибута title любых тегов привязки с классом «hastipy» в качестве содержимого всплывающей подсказки.

Итак, код:

<a href="http://tooltipsy.com/" class="hastipy" title="Click here to go to the tooltipsy website">
     tooltipsy
</a>

Будет ссылкой, показывающей текст «всплывающей подсказки», и когда вы наведете курсор на нее, в подсказке появится надпись «Нажмите здесь, чтобы перейти на сайт всплывающей подсказки».

Тем не менее, что если я захочу поместить перенос строки внутри всплывающей подсказки?

Этот код:

<a href="http://tooltipsy.com/" class="hastipy" title="Click here to <br /> go to the tooltipsy website">
     tooltipsy
</a>

возвращает кучу ошибок при проверке на http://validator.w3.org

Итак, я придумал этот javascript / jQuery (написанный Джейсоном Дженнаро):

$('a').each(function(){
    var a = $(this).attr('title');
    var b = a.replace('lineBreak','\n');
    $(this).attr('title', b);
});

этот код использует ключевое слово (в данном случае lineBreak) и заменяет его на \n (<- перенос строки?), Поэтому мой код проходит проверку и в нем по-прежнему находится разрыв строки. </p>

И этот код работает на jsfiddle (, вот пример ), но на моем сайте внутри всплывающей подсказки это не так. Он вставляет \n, но не удаляет "lineBreak", как это должно быть.

Кто-нибудь может предложить объяснение этого или даже возможное исправление для него?

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

Результат:
Как оказалось, просто использование &lt;br /&gt; вместо <br /> сработало отлично.

1 Ответ

4 голосов
/ 25 сентября 2011

Использовать глобальный вызов на замену: .replace(/lineBreak/g,'\n');.

Если вы хотите добавить <br /> в свой атрибут title, используйте: &lt;br /&gt; (html entity).

Кроме того, JQuery автоматически оборачивает JavaScript внутри $(document).ready(...). Вы должны сделать то же самое:

$(document).ready(function(){
    //HTML-modifying code here.
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...