Jquery 工具：Rangeinput 获取输入更改的值答案

【问题标题】：Jquery tools: Rangeinput get value on input changeJquery 工具：Rangeinput 获取输入更改的值
【发布时间】：2012-02-07 16:10:06
【问题描述】：

我使用Jquery tools rangeinput。

例如我有：

  <input id="testId" title="test" class="range" type="range" name="test" min="0" max="3000" value="15" />

还有脚本：

$(".range").rangeinput();

        $("#testId").live('change', function() { 
            console.log($(this).data("rangeinput").getValue());    
        });

所以默认情况下我的值是 15。然后我输入我的输入 25，但结果控制台是 15，而不是我输入 20，但结果是 25。我做错了什么？

谢谢！

【问题讨论】：

可能是您在插件更新其值之前尝试读取它，这就是为什么您总是获得最后一个值。

标签： jquery range jquery-tools

【解决方案1】：

改用这种方法。发生的情况是在调用 getValue 之前未设置更改的值。调用0 中的setTimeout 将解决这个问题。

$(".range").rangeinput();

$(".range").live('change', function(){
    var $range = $(this);
    setTimeout(function(){
        console.log($range.data('rangeinput').getValue());
    }, 0);
});

【讨论】：

我认为“.live”已被弃用。

【解决方案2】：

如果您可以摆脱live 并直接使用change 它将起作用，因为插件使用更改事件本身。

 $("#testId").change(function() { 
      console.log($(this).data("rangeinput").getValue());    
 });

【讨论】：

【解决方案3】：

<span>Totar horizontalmente</span>
<input id="rota_hor" type='range' name='range' min='0' max='360' step='10' value='3' style="width: 350px;"/>

<script>
    $("#rota_hor").change(function()
    { 
        console.log($(this).attr("value"));
    });
</script>

【讨论】：

【解决方案4】：

您必须使用 jQuery Tools scripting data(toolname) API 来访问值

<input id="myRange" name="some_name" type="range" value="20" min="0" max="100" step="10" />

<script>
var rangeApi = $('#myRange').rangeinput({
    // Some settings here if it needed
}).data('rangeinput');
rangeApi.setValue(100);
console.log(rangeApi.getValue());
</script>

【讨论】：