Question

我正在使用jquery-ui labs中的现有小部件调用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来获取元素，所以id仍然有兴趣听取覆盖/扩展现有小部件或特定内部的最佳实践。

Answer 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();}
    });
});

是否有一种默认方式来获取jQueryUi小部件中的内部属性？

1 个答案: