1

为此使用离子范围滑块。我正在尝试调用我设置为记录缩放的美化函数的值。我的日志缩放有效，但是当我尝试将其调用回我的其他异步函数时，我无法获得相同的结果。

我希望我从 prettify 函数得到的结果通过 onStart、OnChange、onFinish 函数。

onStart: function(data) {
    imprValue = data.from;
  console.log("onstart:" + imprValue);
    inputValues();
 },
 onChange: function(data) {
    imprValue = data.from;
   console.log("onchange:" + imprValue);
    inputValues();
 },
 onFinish: function(data) {
   imprValue = prettify();
   console.log("onfinish:" + imprValue);
   inputValues();
 },
 prettify: function(n) {
  // current position
  var position = Math.floor(n / this.max * 100);
  // position will be between 0 and 100
  var minPos = 0,
      maxPos = 100;
  // calculate logarithms
  var minLog = Math.log(this.min),
      maxLog = Math.log(this.max);
  // calculate adjustment factor
  var scale = (maxLog-minLog) / (maxPos-minPos);
  // round numbers
  n = Math.floor(Math.exp(minLog + scale * (position - minPos)));
  console.log("prettify function:" + n);
  return n;
 }

Jsfidde在这里：http: //jsfiddle.net/jsbegin/7dbowqfd/61/

4

2 回答 2

1

得到这个工作，想发布它以防其他人正在寻找。

你需要这样称呼它：

imprValue = this.prettify(data.from);

在这里工作 jsfiddle：http: //jsfiddle.net/jsbegin/7dbowqfd/68/

于 2017-03-15T15:26:00.593 回答
1

您应该知道，内置美化功能只是为了在视觉上改善滑块值。它不影响原始数据。

如果你也想转换原始数据，你应该创建外部函数。像这样：

var $range = $(".js-range-slider");
var $result = $(".js-result");

function transform(num) {
    var n = num.toString();
    return n.replace(/(\d{1,3}(?=(?:\d\d\d)+(?!\d)))/g, "$1" + ",");
}

$range.ionRangeSlider({
    type: "single",
    grid: true,
    min: 10000,
    max: 10000000,
    from: 10000,
    prettify_separator: ",",
    onStart: function(data) {
        $result.text(transform(data.from));
    },
    onChange: function(data) {
        $result.text(transform(data.from));
    }
});

小提琴：http: //jsfiddle.net/IonDen/133bvhn3/

于 2017-03-27T07:09:21.820 回答