简体   繁体   English

jQuery-ui工具提示不能与HTM按钮一起使用?

[英]Jquery-ui Tooltip not working with HTM Button?

Jquery-ui tooltip function seemingly not working with button as the target. jQuery-ui工具提示函数似乎无法将button作为目标。 Using jquery-ui version 1.9.2 and jquery version 1.8.3. 使用jquery-ui 1.9.2版和jquery 1.8.3版。

I created jsfiddle for my problem, and it seems to not function at all. 我为我的问题创建了jsfiddle ,它似乎根本不起作用。 I'm completely stumped here. 我完全被困在这里。 Here's my javascript: 这是我的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>";
        }
    });
});

And here's the HTML: 这是HTML:

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

Tooltips can be attached to any element. 工具提示可以附加到任何元素。 When you hover the element with your mouse, the title attribute is displayed in a little box next to the element, just like a native tooltip. 当您将鼠标悬停在元素上时, title属性会显示在元素旁边的小框中,就像本机工具提示一样。

But as it's not a native tooltip, it can be styled. 但是由于它不是本机工具提示,因此可以设置样式。 Any themes built with ThemeRoller will also style tooltips accordingly. 使用ThemeRoller构建的任何主题也将相应地设置工具提示的样式。

So to fix your issue you can set an empty title attribute like: 因此,要解决您的问题,您可以设置一个空的title属性,例如:

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

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

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM