Javascript 直接将值设置为滑块

Javascript对我来说是一种新语言，所以这是一项我无法完成的简单任务。当我使用以下命令更改滑块时，我可以设置滑块并更新元素的位置：

// Setup a ui.
webglLessonsUI.setupSlider("#x", {slide: updatePosition(0), max: gl.canvas.width });
webglLessonsUI.setupSlider("#y", {slide: updatePosition(1), max: gl.canvas.height});

其中更新位置为：

function updatePosition(index) {
  return function(event, ui) {
    translation[index] = ui.value;
    drawScene();
  };
}

但是现在我只想设置滑块的值（因为我有一个返回到默认位置的函数），我不能。 我尝试了很多东西，比如：

webglLessonsUI.UpdateUI($('#x'), 0);

以及：

或：

使用这些UI组件的教程如下：

ui组件在这里，如果链接添加到html，或者甚至教程本身（上面的链接）拥有在web上运行滑块所需的所有代码，则可以直接使用

只想直接操纵滑块的值。

---

非常感谢您的帮助，谢谢

根据您提供的示例，我认为需要做几件事才能实现这一目标。首先，第98行和第99行的

main（）

函数设置滑块如下：

setupSlider（#x，{slide:updatePosition（0），max:gl.canvas.width}）； setupSlider（#y，{slide:updatePosition（1），max:gl.canvas.height}）

如果我们检查您提供的库（第99行附近），我们可以看到函数

setupSlider

返回一个包含html引用和更新其值的函数的对象：

    return {
  elem: parent,
  updateValue: (v) => {
    v /= step;
    sliderElem.value = v;
    updateValue(v);
  },
};

这里的问题是，代码没有将此对象分配给您访问的任何引用（变量），因此基本上会创建元素，侦听器会设置为HTML元素，但当您调用

$（'#x'）

时，您访问的是HTML引用，而不是具有更新功能的对象

因此，我做的第一件事是添加两个全局变量来存储从

setupSlider

返回的对象：

let slider1,
slider2

然后我们将示例的第99行和第98行更改为存储返回的对象，如下所示：

slider1=webglLessonsUI.setupSlider（#x“，{slide:updatePosition（0），max:gl.canvas.width}）

slider2=webglLessonsUI.setupSlider（#y“，{slide:updatePosition（1），max:gl.canvas.height}）

这允许我们在其他函数上访问它们，因此我创建了一个函数，用于更改给定滑块对象的值：

function updateSlider(slider, value) {slider.updateValue(value)}

在我的例子中，为了简单起见，我创建了一个超时，在2秒后调用这个函数，但是您可以将这个函数分配给onClick事件，或者基本上任何您想要的东西

下面是我举的例子：

如果你等几秒钟，你会看到slider x将其值更新为100，我并不担心更新Ui的其余部分，但我认为这超出了问题的范围

---

希望有帮助

谢谢你这么完整的回答！这就是我要找的东西一些，很高兴能帮上忙！这是给你的吗@Itsca？

let slider1,
slider2

function updateSlider(slider, value) {slider.updateValue(value)}