如何关注qtip中的元素(jquery插件)

Dav*_*vid 2 jquery focus qtip qtip2

我正在尝试打开qtip(v2.0.0)并让它专注于链接 - 菜单中的第一项.(更一般地说,我试图将这个精彩的qtip用作一种上下文菜单,并将重点放在第一个li /菜单项上,这样他们就可以方便地按Enter而不必点击.)所以......

$("tr.request td").qtip({
        content : {
            text: $('#qtipMenu').clone(),
            title : {button : true, text : ' '}
        },
        position : {my : 'bottom center' , at : 'top center'},
        show : {event : 'click'},
        hide : false, 
        events : {
            show : function(){ 
                var selector =  "#"  + this.id + " ul > li:first > a " ;

                // for the sake of experiment...
                $(selector).focus(function(){console.warn("focus on this "+this.tagName + " element!") })
                // and the callback fires, but...
                $(selector)[0].focus(); // doesn't work
                $(selector).focus(); // doesn't work either
                // nor does this:
                $("div.ui-tooltip-content ul > li:first > a").focus();
                // ...though I know I'm definitely addressing this element
                // and can manipulate it in other ways
            },
            render : function(event) {
                $("div.ui-tooltip-content ul").removeAttr('id').show()
            }
        }
    });
}
Run Code Online (Sandbox Code Playgroud)

FWIW,每个qtip的内容都是从隐藏的UL元素克隆的,因此:

<ul id="qtipMenu" style="display:none" class="qtip-menu">
   <li><a href="admin/requests/view">view details</a></li>
   <li><a href="admin/requests/add">add to schedule</a></li>
   <li><a href="admin/requests/delete">delete</a></li>
</ul>
Run Code Online (Sandbox Code Playgroud)

是的,它包含在$(document).ready(function(){})中."焦点"事件处理程序按预期激发,但浏览器UI的实际焦点没有发生(希望我能清楚地解释自己).

有任何想法吗?

Dav*_*vid 6

答案是......在"可见"而不是"表演"上进行."可见"发生在"表演"之后

$(myTarget).qtip( {

    events: {
        visible : function() {  $(myElementWithinTheTooltip).focus() }
    }
);
Run Code Online (Sandbox Code Playgroud)

愿它为别人节省几个小时的痛苦.我将留给你忍者解释时间的内部细微之处导致了我的问题.

  • 它确实为我节省了几个小时的痛苦.谢谢大卫:D (2认同)