Question

我正在MVC4中编写一个时间注册移动应用程序，我正在使用滑块输入类型。

<input type="range" name="time_verdi" id="slider" value="7.5" min="0.0" max="24" step="0.5" data-highlight="true"/>

这会产生一个滑块，以及滑块左侧的文本框。但是，我希望用户能够输入自己的值，例如7.25小时。这可以立即完成，但是当焦点离开文本框时，它将在7.25小时到7小时之间进行验证。有没有办法不验证文本框？我有服务器端验证。感谢。

Answer 1

我认为你不能只使用与步长增量不匹配的输入值来驱动范围滑块，因为框架代码完全取决于你提供的步骤（0.5），它总是会四舍五入到最接近的值步骤，如果你摆脱这个代码，它只会驱动文本框值，而不是通过滑块移动。请重新访问您的要求。

原始代码：

//from jQuery UI slider, the following source will round to the nearest step
var valModStep = ( newval - min ) % step;
var alignValue = newval - valModStep;

if ( Math.abs( valModStep ) * 2 >= step ) {
    alignValue += ( valModStep > 0 ) ? step : ( -step );
}
var percentPerStep = 100/((max-min)/step);
// Since JavaScript has problems with large floats, round
// the final value to 5 digits after the decimal point (see jQueryUI: #4124)
newval = parseFloat( alignValue.toFixed(5) );

Answer 2

我在输入文本框时使用javascript更改步骤：

    <script type="text/javascript">
        $(document).on("pageinit", "#registrerPage", function (event) {

            $('#slider').focus(function () {
                document.getElementById("slider").step = ".1";
            });
        });
    </script>

JQuery / HTML5 Slider - 允许自己输入

2 个答案: