使用jQuery UI小部件时，如何发现所有可用属性? [英] How do I discover all available properties when using a jQuery UI widget?

问题描述

我最近发现，某些jQuery UI小部件可以使用其他属性，但是没有记录.例如，当在jQuery UI 1.11.4对话框上提供buttons属性时，我可以使用id和autofocus之类的子属性，在

I have recently found that there are additional properties for some jQuery UI widgets that work, but are not documented. For example, when providing the buttons property on a jQuery UI 1.11.4 dialog box, I can use sub-properties like id and autofocus, neither of which are listed in the official documentation.

$("#myDialog").dialog({
    title: "Do the thing?"
    buttons:
    [
        {
            text: "Yes",
            id: "dialogBtnYes",
            click: function () {
                $(this).dialog("close")
            }
        },
        {
            text: "No thanks",
            id: "dialogBtnNo",
            autofocus: true,
            click: function () {
                $(this).dialog("close")
            }
        }
    ]
});

我想知道还有多少其他未记录的选项可供我使用.我已经尝试梳理JavaScript文件，但是对于像我这样的JavaScript新手来说，这是非常艰巨的.

I'm left wondering how many other undocumented options are available for me to use. I've tried combing through the JavaScript file, but it's very daunting for a JavaScript novice like myself.

您是否正在通过源代码梳理您为找出其他隐藏"功能所建议的内容，或者这不可行吗?如果这是要走的路，在我们的太阳变成红色巨人之前的某个时候，您有什么建议可以给我做些什么?如果不是，您可能会建议您使用什么其他方法来学习jQuery UI(或任何JavaScript框架)必须提供的其他内容?

Is combing through the source code what you guys would recommend for figuring out other "hidden" features, or is this not feasible? If it's the way to go, is there any advice you can give me on how to accomplish this sometime before our sun becomes a Red Giant? If not, what other methods might you recommend for learning what else jQuery UI (or any JavaScript framework, for that matter) has to offer?

推荐答案

使用递归函数枚举库的所有方法和属性.例如:

Use a recursive function for enumerating all the methods and properties of the library. For example:

function getUDFs()
    {
    var current;

     /* Use a local variable named current instead of a global variable */

    for(current in arguments[0])
      {
      getUDFs.id = arguments[1]  + " => ";

      /* If the property is not null or undefined */
      if (!!arguments[0][current] || arguments[0][current] === "")
        {
        /* If the constructor is a standard JavaScript type */
        if (/Function|String|Object/.test(String(arguments[0][current].constructor) ) )
          {
          /* Store in an array */
          if (getUDFs.hasOwnProperty("data") )
            {
            getUDFs.data.push(getUDFs.id + current)
            }
          else
            {
            getUDFs.data = []
            }
          }

        if (/Object|Function/.test(String(arguments[0][current].constructor) ) )
         {
         getUDFs(arguments[0][current], getUDFs.id + current)
         }
        }
      }  
     }

getUDFs($.ui,"jQueryUI");
console.log(getUDFs.data);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>

一旦jQuery UI对象成为DOM元素，就会添加id和mousemove属性.例如:

The id and mousemove properties are added once the jQuery UI object becomes a DOM element. For example:

function getUDFs()
    {
    var current;

    for(current in arguments[0])
      {
      getUDFs.id = arguments[1]  + " => ";

      if (!!arguments[0][current] || arguments[0][current] === "")
        {
        if (/Function|String|Object/.test(String(arguments[0][current].constructor) ) )
          {
          if (getUDFs.hasOwnProperty("data") )
            {
            getUDFs.data.push(getUDFs.id + current)
            }
          else
            {
            getUDFs.data = []
            }
          }

        if (/Object|Function/.test(String(arguments[0][current].constructor) ) )
         {
         getUDFs(arguments[0][current], getUDFs.id + current)
         }
        }
      }  
     }

getUDFs(document.body,"document.body");
console.log(getUDFs.data);

参考

• Object.prototype.原型-JavaScript | MDN
• 原型和原型继承
• JavaScript中的类-解释
• 从QSA迁移到Qt脚本| Qt 4.8
• objectTree
• Tour de Flex

• Object.prototype.proto - JavaScript | MDN
• Prototype and prototypal inheritance
• Classes in JavaScript - Explained
• Moving from QSA to Qt Script | Qt 4.8
• objectTree
• Tour de Flex

这篇关于使用jQuery UI小部件时，如何发现所有可用属性?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！