显示Jquery工具提示点击鼠标悬停的文本框

Question

我正在使用Jquery工具提示。

如何显示工具提示点击文本框中的鼠标。css用来显示工具提示箭头在中心(对于第二个文本框)的第二个文本框，它的下移。

<br/><br/>
<input id="ag22" title="We ask for your age only for statistical purposes.We ask for your age only for statistical purposes.We ask for your age only for statistical purposes.We ask for your age only for statistical purposes.We ask for your age only for statistical purposes." />

<br/><br/>
<input id="ag22" title="We ask for your age only for statistical purposes." />

jQuery

$(document).tooltip({
    position: {
        my: "left center",
        at: "right center",
        using: function (position, feedback) {
            $(this).css(position);
            $("<div>")
                .addClass("arrow")
                .addClass(feedback.vertical)
                .addClass(feedback.horizontal)
                .appendTo(this);
        }
    }
});

下面是我尝试过的链接：http://fiddle.jshell.net/b7SCN/

Answer 1

当您单击这个trigger时，可以添加一个jsFiddle来模拟鼠标。

http://jsfiddle.net/AK7pv/

在不能使用相同的ID添加两个元素之后，使用CLASS具有多个元素

检查此主题：jQueryUI tooltip Widget to show tooltip on Click

Answer 2

不要在mouseover上做任何事情，在初始化工具提示之前添加它。您可能还必须禁用focusin

$('input').on('mouseover',function(e) {
    e.preventdefault();
});

在单击时打开触发器工具提示

$('input').on('click',function(e) {
    $(this).tooltip('open');
});

编辑:将$(document).tooltip更改为$('input').tooltip