javascript - 尝试将值动态传递到输入元素中

Question

我正在使用 this JQuery gauge .

我正在尝试创建某种设置动画，例如 100，然后在 300 毫秒后显示 97，然后在 200 毫秒后显示 110，等等。

我想完全不依赖于那个输入字段(它会在某个时候被扔掉)，那么我怎么才能只使用一组具有恒定延迟的设置数字，其中动画播放基于速度在数组中的数字上，并在每个数字之后延迟一个延迟常数(假设为 300 毫秒。)

谢谢。

我尝试选择元素并应用这样的设置值:$("#myValues").myfunc({divFact:20,eventListenerType:'keyup'}).val(100)，但它只是将数字放在那里而没有结果，它使用的是 eventListenerType:'keyup' 并且我的 val 函数是 def。在 100 之后不发送 keyup。

Here is a Fiddle

Answer 1

您可以遍历数组并根据索引中的值设置输入字段的值:

$("#myValues").myfunc({
  divFact: 10
});

var time = 0;
$.each([ 100, 90, 80, 70 ], function( index, value ) {
 setTimeout( function(){ $("#myValues").val(value).change(); }, time)
 time += 1000;
});

要延迟每次迭代，您可以使用 setTimeout 函数包裹值的 setter 。

我删除了 keyUp 事件，因为该插件具有您可以使用的 eventListenerType 的默认值，但这必须被触发。

当您还想延迟第一次迭代时，将 time 的初始值设置为您想要的任何值。

Example