Question

我在TypeScript应用程序中使用jQuery UI滑块，使用TypeScript 0.9和从DefinitelyTyped下载的最新jqueryui.d.ts定义文件：

/// <reference path="jquery/jquery.d.ts" />
/// <reference path="jqueryui/jqueryui.d.ts" />

. . .

$("#sideRestitution").slider({
  min: 0.0,
  max: 1.0,
  step: 0.01,
  value: game.sideRestitution,
  change: (event, ui) => {
    game.sideRestitution = ui.value;
  }
});

它运行正常，但我无法弄清楚如何以“键入”的方式使用窗口小部件：在上面的代码中change的类型为any。 jqueryui.d.ts使用特定于滑块窗口小部件的事件和方法定义Slider接口，但返回此类接口的唯一方法或属性是全局$.ui.slider。

如何访问/使用我创建的滑块小部件的Slider界面？

$.ui.slider的用途/用途是什么？

Answer 1

您还需要包含jquery.d.ts才能访问和操作类型化的jQuery对象。这将允许您以典型的jQuery方式访问滑块。例如：

/* Initialize slider with ID 'my_slider'. */
$("#my_slider").slider({
    min: 0,
    max: 100,
    value: 0,
    change: (event: Event, ui) => {   
        /* Update as desired. */
    }
});

在此示例中，$('#my_slider')的类型在jquery.d.ts中定义，所有相关的滑块函数等都在jqueryui.d.ts中定义。

只是为了完成示例，在HTML中，您需要以下内容：

<div id="my_slider"></div>

编辑：我认为这是一个错误。即使有以下内容：

var my_slider : JQueryUI.Slider = $('#my_slider').slider;
my_slider.slide({
  ...
})

它仍然没有注册slide的类型信息。

这是一个黑客攻击修复。将SliderUIParams接口（jqueryui.d.ts中的第442行）替换为实际接口：

interface SliderUIParams {
  value: number;
  values?: number[];
  handle: JQuery;
}

然后，在滑块调用中，静态输入您的控件，例如：

slide: (event: Event, ui: JQueryUI.SliderUIParams) => {
  ...
}

Answer 2

使用当前版本的jqueryui.d.ts，无法以'typed`方式定义窗口小部件事件。

全局$.ui.slider，$.ui.accordion等用作定义新小部件的基础 - 例如：

$.widget("ui.myslider", $.ui.slider, { . . . });

创建一个新的myslider小部件，用于扩展内置滑块小部件。这些全局变量也用于访问每个小部件的原型，例如修改它们的默认选项：

$.ui.slider.prototyp.options.min = -100;

将所有滑块的默认最小值修改为-100。

jqueryui.d.ts中这些全局变量的定义似乎是错误的：它没有定义prototype，而是定义了许多其他成员 - 就像所有选项一样 - 实际上并不存在。

TypeScript中的jQuery UI小部件

2 个答案: