2013-10-24 2 views
1

Функция подсказки JQuery-ui, по-видимому, не работает с кнопкой в ​​качестве цели. Использование jQuery-ui версии 1.9.2 и jQuery версии 1.8.3.JQuery-ui Tooltip не работает с кнопкой HTM?

Я создал jsfiddle для моей проблемы, и, похоже, не работает вообще. Я совершенно здесь. Вот мой JavaScript:

$(document).ready(function() { 
    $('#myBtn').tooltip({ 
     position: { 
      my: "left top", 
      at: "bottom" 
     }, 
     content: function() { 
      return "This tooltip is a function return value with <b>HTML content</b>"; 
     } 
    }); 
}); 

А вот HTML:

<body> 
    <form> 
     <button id="myBtn" class="text">My button</button> 
    </form> 
</body> 
+1

О, теперь я вижу. Элементу нужен атрибут title для работы. Кажется ясным сейчас, но я думал, что должен хотя бы ответить на мой собственный вопрос. Вот [исправленная скрипка] (http://jsfiddle.net/CEaqw/1/). Обратите внимание на атрибут 'title =" x "' в HTML. – tark

ответ

1

Tooltips может быть присоединен к любому элементу. Когда вы наводите элемент мышью, атрибут title отображается в маленьком прямоугольнике рядом с элементом, точно так же, как встроенная всплывающая подсказка.

Но, поскольку это не родная всплывающая подсказка, она может быть стилизована. Любые темы, созданные с помощью ThemeRoller, также будут подгонять подсказки.

Так, чтобы решить проблему можно установить пустой атрибут заголовка, как:

<body> 
    <form> 
     <button id="myBtn" title="" class="text">My button</button> 
    </form> 
</body> 

Demo: http://jsfiddle.net/VSEQP/

+0

Если вы не хотите добавлять заголовок в HTML, вы также можете сделать это с помощью jQuery '$ ('selector'). Attr ('title', '');' – Liam

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