使用jQuery UI Slider的自定义范围/变量集

问题描述

我想看看是否可以创建一个自定义数据集以与 jQuery UI Slider 一起使用.我正在一个衣服尺寸在以下范围内的网站上:[0，2，4，6，8，10，12，14，16，18，16W，18W，20W]

I wanted to see if I could make a custom data set to use with jQuery UI Slider. I'm working on a site that has dress sizes that come in the range of:[ 0, 2, 4, 6, 8, 10, 12, 14, 16, 18, 16W, 18W, 20W ]

我遇到的问题是在18岁之后突然出现的，当它跳到有些独特"的宽"尺寸时.

The issue I'm having arises right after 18, when it jumps to "wide" sizes that are a bit unique.

在添加16W，18W和尺寸之前，我使用以下代码创建了一个工作滑块:

Before I added in the 16W, 18W, and on sizes, I created a working slider using the following code:

$("#slider-size .slider").slider({
  min: 0,
  max: 18,
  step: 2,
  slide: function(event, ui) {
    $(".rsize").text(ui.value);
  }
});

该函数中的最后一个参数在更改滑块时会更改文本值.

有人知道如何将16W，18W等添加到此列表的末尾吗?

谢谢！

推荐答案

对于自定义尺寸，您可以使用其他数组作为标签:

for custom sizes, you may use another array for your labels:

var sizes = ["0","2","4","6","8","10","12","14","16","18","16W","18W","20W"];
$("#slider-size .slider").slider({
  min: 0,
  max: sizes.length - 1,
  step: 1,
  slide: function(event, ui) {
    $(".rsize").text(sizes[ui.value]);
  }
});

现在，要添加或删除大小，只需修改sizes数组.

Now, to add or remove sizes, just modify the sizes array.

这篇关于使用jQuery UI Slider的自定义范围/变量集的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！