是否有默认方法来获取 jQueryUi 小部件中的内部属性？答案

【问题标题】：Is there a default way to get hold of an internal property in jQueryUi widget?是否有默认方法来获取 jQueryUi 小部件中的内部属性？
【发布时间】：2010-03-23 23:01:18
【问题描述】：

我正在使用来自 jquery-ui 实验室调用 selectmenu 的现有小部件。它具有关闭和打开事件的回调选项。问题是我需要在这些事件中为一个节点设置动画，该节点是小部件的一部分，但不是它所连接的。为此，我需要访问此节点。

例如，如果我要实际修改小部件代码本身：

// ... other methods/properties

"open" : function(event){
    // ... the original logic

    // this is my animation
    $(this.list).slideUp('slow'); 

    // this is the orginal call to _trigger
    this._trigger('open', event, $this._uiHash());
},

// ... other methods/properties

但是，当我在事件处理程序的范围内附加this 时，是我调用小部件的原始元素。我需要小部件实例或特别是小部件实例的 list 属性。

$('select#custom').selectmenu({
    'open': function(){
       // in this scope `this` is an HTMLSelectElement not the ui widget
     }
});

从小部件获取list 属性的最佳方法是什么？

编辑：注意我在下面发布了我的最终解决方案。但是，我不喜欢回到 DOM 来获取元素，所以我仍然有兴趣了解覆盖/扩展现有小部件或特定内部的最佳实践。

【问题讨论】：

.list 是一个类的名称吗？
不，list 是一个 ul 元素，小部件用于模仿标准 select 标记中的选项下拉菜单。我也不能通过选择器选择它，因为我可能在一个页面上有多个，它们不会有 id - 只有类。
你试过了吗：$(this).find('ul').slideUp('slow') indead of : $(this.list).slideUp('slow');
@val: 但是有问题的ul 与this 引用的选择元素没有任何关系，这就是我需要引用才能列出的问题，我无法将其拉出 dom因为没有可靠的方法。
@val：实际上我收回了它......它添加了一个我之前错过的基于小部件类的 ID。我可以使用标准选择器。

标签： javascript jquery jquery-ui scope

【解决方案1】：

所以最后看来我错过了该列表根据插件名称和原始元素 id 分配一个 id。所以以下工作：

jQuery(function(){
    jQuery('select#custom').selectmenu({
        width: 100, 
        'style': 'dropdown',
        "open": function(e, data){
            var menu = jQuery('ul#'+$(this).attr('id')+'-menu');
            menu.hide().slideDown('slow');
        },
        "close": function(e, data){
            var menu = $('ul#'+jQuery(this).attr('id')+'-menu');
            menu.addClass('ui-selectmenu-open').slideUp('slow', function(){
                menu.removeClass('ui-selectmenu-open');
            });

        },
        "change": function(){window.location = $(this).val();}
    });
});

【讨论】：