Question

以下问题：我有一些类型范围的输入字段。 jQuery mobile会自动将它们转换为一个带滑块的输入字段。我想要做的是在打字时进行即时验证。验证脚本应删除所有非数字。我使用的函数适用于输入字段文本，但不适用于输入类型范围。

这是我的HTML：

<label for="my_range_input_field">label_text:</label>
<input data-type="range" type="range" name="my_range_input_field" id="my_range_input_field" value="10000" min="0" max="85000"  />

这是我的jQuery验证功能：

$(document).delegate('#my_range_input_field', 'input', function(e) {
    $(this).val($(this).val().replace(/[^\d]/g, ""));
});

问题是，此函数删除整个输入值而不仅仅是非数字。我尝试调试，当使用console.log显示val时，我看到它总是一个空字符串，不仅在输入字段中输入了数字。我做了一些研究，发现了以下内容： How to get the raw value an <input type="number"> field?

所以有类似预先验证的东西，似乎我无法检索到我想要的值，因为它无效并显示为空字符串。还有办法获得这个价值吗？

或者至少有类似范围输入字段的:invalid选择器，以向用户显示红色背景或什么？

Answer 1

您可以使用此常规解决方案来防止输入字母字符。不是我的代码，但我找不到链接来信任编写代码的人。

<强>演示

https://jsfiddle.net/gv4xp4y7/

$(document).on("keydown", "input.ui-slider-input", function (e) {
  if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
    (e.keyCode == 65 && e.ctrlKey === true) || 
    (e.keyCode >= 35 && e.keyCode <= 40)) {
    return;
}
if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
  e.preventDefault();
}});

如何为jQuery移动输入类型范围编写验证函数？

1 个答案: