1

我试图同时找出 OOP Javascript、jQuery 和 jQuery UI。基本上，我想创建一个自定义“面板”组件，我可以在整个 Web 应用程序的各个地方重用它。该面板由一个标题栏和其下方的内容组成。

所以我使用 jQuery UI 来完成这个。我希望能够制作组件，然后更改其属性（如标题栏文本）。这是一个例子：

$(function()
{
    $.widget("custom.ShinyPanel",
    {
        options: {
            css:{},
            title:""
        },

        _create:function()
        {
            $(this.element).addClass("shinyPanel").disableSelection();
            this.titleBar = $(createElement("div")).addClass("shinyPanelTitleBar").appendTo(this.element);
            this.topShine = $(createElement("div")).addClass("shinyPanelTopShine").appendTo(this.element);
            this.leftShine = $(createElement("div")).addClass("shinyPanelLeftShine").appendTo(this.element);
            this.content = $(createElement("div")).addClass("shinyPanelContent").appendTo(this.element);

            this._refresh();
        },

        _refresh:function()
        {
            if (this.options.hasOwnProperty("title"))
                $(this.titleBar).html(this.options.title);
        }
    });
});

// $("#divShotList").ShinyPanel({title:"Shot List"});    // this works
$("#divShotList").ShinyPanel();
$("#divShotList").title = "Shot List";                   // this doesn't work


<div id="divShotList" style="position:absolute; top:5px; bottom:10px; width:250px;"></div>

有没有办法让我重载=运算符或使用这种语法使它工作的东西？我知道我可能可以创建一个额外的函数，比如setProperty或其他什么，但如果我能保持这种语法并让它工作，那就太酷了。知道如何修改小部件以实现这一点吗？

4

1 回答 1

1

元素或 jQuery 包装的元素不是您的小部件：

$("#divShotList").data('ShinyPanel')._setOption('title', 'something');

但它存储在元素 的.data()中。

或者：

var shinyPanel = $("#divShotList").ShinyPanel().data('ShinyPanel');
shinyPanel.options.title = 'new title';
shinyPanel.refresh();

也可以。

最后编辑：回答你的问题：不。

于 2012-07-02T20:34:33.573 回答