INPUT TYPE =范围不更新它的值

我有以下几点：INPUT TYPE =范围不更新它的值

<input id="slider-min" type="range" min="0" max="55" value="0" 
step="5" onchange="sliderMinUpdate(this.value)">, 

<div id="min_input">0</div> 

<input id="slider-day" type="range" min="0" max="10" value="0" 
step="0.5" onchange="sliderDayUpdate(this.value)"> 

function sliderDayUpdate(value){ 
    $('#slider-min').val(0); 
} 

function sliderMinUpdate(value){ 
$('#min_input').text(value);  
}

当我使用键盘slider-min关注和选择键向右或向左它min_input正确更新值。当我更改slider-day时，它触发onChange并将值从slider-min更新为0，我可以看到它在我的页面中工作（滑块返回0）。当我选择slider-min的第一个增量时出现问题，在这种情况下为5.当onChange从slider-day被调用时，它将slider-min更新为0，但是当我从0移动到5时（slider-min）它不起作用。如果我继续移动它的作品。

貌似状态5保持在slider-min，所以当我设置$('#slider-min').val(0)，滑块被更新，但是当我改变从0到5，onchange="sliderMinUpdate(this.value)"不被调用。

不知道发生了什么事。

来源

2012-02-07 Zora Li

多丽丝知道HTML5。问她:-) – zod 2012-02-07 21:42:59

所有多丽丝笑话+1！ – Sam 2012-05-01 05:10:40

随着d3使用.property而不是.attr http://stackoverflow.com/a/35632263/6305204 – 2016-11-09 10:21:59

我对你的问题有点困惑，这个答案可能是错的，不相关的，或者太迟了，但我遇到了与Chrome v23（目前截至2012年12月24日）类似的东西。据我所知，jQuery使用getAttribute（）和setAttribute（）与普通元素交互，但这些函数似乎不适用于输入类型=“范围”>。由于这里不需要jQuery（除了简化选择器），我会推荐使用正常的DOM document.getElementById（'rangeElement'）。value = x;获取/设置滑块的值。

来源

2012-12-23 16:34:11 jimmetry

你必须：

变化值和
触发一个事件onchange。

我一直在用jQuery + QUnit + FuncUnit这样做是为了处理等待，但下面应该只需要jQuery的。

$('input[type="range"]').val('0.5').trigger('change');

其中(min <= '0.5' => max)

来源

2015-01-08 16:18:23 iainH

我也有类似的问题，但没有使用jQuery但D3.js.正如jimmetry在他的回答中所述，jQuery似乎不能正确返回<input type="range">的值。 D3.js似乎也是如此。

在我的情况下，这行代码没有返回任何更新值，但始终是它们的初始值值。

var min = $("#slider-min").attr("value");    // using jQuery 
var min = d3.select("#slider-min").attr("value");  // using D3

使用老式的方法，令人惊讶的是更新的值总是返回：

var min = document.getElementById('slider-min').value;

来源

2016-10-26 12:46:06

INPUT TYPE =范围不更新它的值

回答

相关问题