jQuery пользовательский контент tooltip ничего не показывает

Следуя подсказкам подсказки от jQuery UI API Я пытаюсь создать всплывающие подсказки с пользовательским содержимым html, но ничего не появляется. Консоль не показывает ошибок с моим скриптом, только некоторые из jQuery-UI (но ничего особенного).jQuery пользовательский контент tooltip ничего не показывает

Может ли кто-нибудь сказать мне, что я делаю неправильно?

$(document).ready(function() { 
 
    $(function() { 
 
    $(document).tooltip({ 
 
     items: "custom-tooltip", 
 
     content: function() { 
 
     var element = $(this); 
 
     if (element.is("custom-tooltip")) { 
 
      return "<a>THIS<br/>IS<br/><A><br/>TOOLTIP!"; 
 
     } 
 
     } 
 
    }); 
 
    }); 
 
});

<!doctype html> 
 
<html lang="en"> 
 

 
<head> 
 

 
    <meta charset="UTF-8"> 
 
    <title>CUSTOM TOOLTIPS</title> 
 

 
    <link rel="stylesheet" href="jquery-ui.css"> 
 

 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
    <script src="jquery-1.10.2.js"></script> 
 
    <script src="jquery-ui.js"></script> 
 

 
    <script src="tooltips.js"></script> 
 

 
</head> 
 

 
<body> 
 

 
    <h3><a href="#" custom-tooltip="">HOVER ME</a></h3> 
 

 
</body> 
 

 
</html>

источник

2015-03-19 Miha Šušteršič

.is функция требует селектор. Для сопоставления атрибута, если он существует, окружать его в квадратных скобках []:

if (element.is("[custom-tooltip]")) {

То же самое с опцией items:

 items: "[custom-tooltip]",

Остальной частью коды выглядит отлично. Обратите внимание, что вам, вероятно, не нужна проверка if, так как items уже ограничит виджет теми же тегами.

Более подробную информацию о допустимых селекторов можно найти на страницах документации: http://api.jquery.com/category/selectors/

источник

2015-03-19 11:16:45 blgt

Ну это как раз тот случай, когда я хочу для работы с чем-то простым, если есть, когда я хочу несколько подсказок на нескольких элементах, я думаю, или есть более простой способ? Например, если у меня есть 5 различных подсказок для 5 разных элементов, я сделаю и если предложение для каждого элемента –

Обычным способом будет использование 'title'. Но если вы загружаете контент динамически, то у вас есть хороший простой способ сделать это. [Один из примеров на странице jqueryui] (https://jqueryui.com/tooltip/#custom-content) делает то же самое – blgt

Смотрите эту JSFiddle. Вы ошибаетесь в настройках инструментальных подсказок. элементы Tooltip настройки должны быть такими: items: "[custom-tooltip]" и почему вы вызываете документировании готов работать таким образом

$(document).ready(function() { -- document ready event 
    $(function() { -- same document ready 
    $(document).tooltip(...); 
    }); 
});

JQuery код будет как:

$(function() { 
    $(document).tooltip({ 
     items: "[custom-tooltip]", 
     content: function() { 
     var element = $(this); 
     if (element.is("[custom-tooltip]")) { 
      return "<a>THIS<br/>IS<br/><A><br/>TOOLTIP!"; 
     } 
     } 
    }); 
});

источник

2015-03-19 11:31:54 111

jQuery пользовательский контент tooltip ничего не показывает

ответ

Смежные вопросы