无法拖动滑块手柄

Question

我已经以编程方式创建了一个时间范围滑块（noUiSlider）。

它工作正常，但我不能拖动滑块手柄（可用作默认行为），以便更改滑块值。

var noUiSlider = require('./js/nouislider');

var sliderDiv = document.createElement("div");
sliderDiv.id = "slider-"+soundElement.description;
var sliderElem: any = noUiSlider.create(sliderDiv, {
    start: [0, 50],
    tooltips: [true, true],
    behaviour: "tap-drag",
    connect: true,
    orientation: 'vertical',
    range: {
        min: 0,
        max: 100
    }
});
soundElementIframe.appendChild(sliderDiv);

我无法弄明白，为什么拖动互动无法正常工作（而其他所有类似的工作都是“正常工作”）。我非常感谢你们提供任何帮助。

Answer 1

我认为正在发生的事情是创建滑块，然后在添加它时丢失了它的（默认值）侦听器。为避免这种情况，请附加div then 初始化noUiSlider元素。

const sliderDiv = document.createElement('div');
soundElementIframe.appendChild(sliderDiv);
noUiSlider.create(sliderDiv, options);

如果仍然无法解决问题，请尝试重新选择新添加的sliderDiv元素，并将其传递到noUiSlider.create()方法中。