jQuery Mobile - Slider 滑块

滑块允许您从值范围中选择一个数值。 滑块为您提供了一个手柄来滑动和选择一个值。

下表列出了 jQuery Mobile 中使用的滑块类型 −

序号 滑块类型 & 说明
1 Basic slider

要添加滑块小部件,请使用带有 type = "range" 属性的输入。

2 Step attribute

您可以通过将 step 属性添加到 <input> 来强制滑块捕捉到特定的增量。

3 Highlight

要突出显示轨道上直到滑块手柄位置的填充,请添加 data-highlight = "true" 属性。

4 Theme

要为您的滑块设置主题色板,您可以将 data-theme 属性添加到 <input>

5 Mini sized

对于更紧凑的滑块版本,您可以在 <input> 中使用 data-mini 属性。

6 Disabled

您可以使用 disabled 属性禁用滑块。

7 Label hidden

您可以通过将 ui-hidden-accessible 类添加到您的 <label> 来隐藏滑块的标签。

8 Fieldcontain
ui-field-contain 类添加到 div 将确保响应式呈现表单。
9 Fieldcontain, mini sized

可以将 ui-field-contain 类添加到 mini 滑块以响应地呈现它。

10 Full width slider, no input

您可以隐藏数字输入,并可以使用自定义 CSS 使滑块全宽

11 Dynamically injected

可以使用 JavaScript 函数在运行时创建滑块。

❮ jQuery Mobile - 小部件