jQuery UI 运算符重载

jQuery UI Operator Overloading?

本文关键字：重载 运算符 UI jQuery      更新时间：2023-09-26

我试图同时找出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或其他东西，但如果我可以保留这种语法并让它工作，那将非常酷。知道我如何修改小部件以实现这一目标吗？

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

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

但它存储在元素的 .data（） 中。

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

也会工作。

<小时 />最终编辑：回答你的问题：不。

相关文章：