Question

我无法确定给定jQueryUI窗口小部件实例的类型。

jQueryUI documentation for the Widget Factory提出了两种技巧。从“实例”部分：

可以使用以下命令从给定元素中检索窗口小部件的实例   instance（）方法。 [...]   如果在不是的元素上调用instance（）方法   与小部件相关联，返回undefined。

：数据选择器还可以确定元素是否具有给定值   小部件绑定到它。

根据他们的例子，假设我初始化一个日期选择器，然后代码检查它是否是一个日期选择器：

<p>Date: <input type="text" id="datepicker"> </p>

  $(function() {
    $("#datepicker").datepicker();

    // ...
    var i = $("#datepicker").progressbar("instance"); // i is undefined as expected
    console.log(i);
    var b = $("#datepicker").is(":data('ui-datepicker')"); // b = false, not sure why
    console.log(b);
    var i2 = $("#datepicker").datepicker("instance"); // this throws an exception
    console.log(i2);
  });

基于文档，我期望.is调用返回true，最后一行返回实例（不抛出异常。）

JSFiddle is here。（您需要打开浏览器的控制台才能看到记录的输出。）

Answer 1

事实证明我上面列出的技术适用于许多jQueryUI小部件，例如：按钮，进度条。

但是，datepicker有点奇怪。在初始化datepicker之后查看DOM，我看到在命名元素之后，将datepicker作为新元素插入。

要获取datepicker小部件实例，我需要从命名元素开始导航DOM。要检查输入字段是否有一个日期选择器，我们只需检查类hasDatepicker的元素：

var isDatePicker = $("#datepicker").is(".hasDatepicker");

这适用于jQueryUI 1.11.2，并且基于其他SO问题，它自2009年以来一直在运行。所以我猜它是一种可靠的技术，但我不确定它是否记录在任何地方，或保证未来的版本。

确定标准jQueryUI小部件的类型

1 个答案: