HTML5 范围 - 不支持的伪：范围答案

【问题标题】：HTML5 range - unsupported pseudo: rangeHTML5 范围 - 不支持的伪：范围
【发布时间】：2016-09-29 03:49:59
【问题描述】：

您好，我有一个相当简单的问题。我使用 HTML5 范围滑块类型：<input type="range">，我想通过 jQuery 触发它。

我使用了以下代码：

$("form input:range").each(function () {
    // Do something
});

由于某种原因，我收到以下错误：

！未捕获的错误：语法错误，无法识别的表达式：不支持的伪：范围

也许很重要：我使用 jquery-1.12.1.min.js。

现在有人知道这是为什么，我该如何解决？

【问题讨论】：

【解决方案1】：

试试这个：

jQuery("input[type=range]")

: 用于获取某种元信息，通常与用户对元素的操作有关。

例如：:hover 仅适用于用户将光标放在上面的元素，:visible 是用户可以看到的元素。

编辑

Pranav C Balan 的回答更好地解释了发生了什么：HTML5 range - unsupported pseudo: range

【讨论】：

【解决方案2】：

css 或 jQuery 中没有 :range 伪选择器。相反，您可以使用attribute equals selector

$("form input[type='range']").each(function () {
    // Do something
});

对于所有支持的选择器列表，请访问：JQuery Selectors

【讨论】：

【解决方案3】：

是的，你需要使用属性等于选择器：

jQuery("input[type=range]")

您可以使用:in-range 或:out-of-range css 选择器来指定最小值和最大值范围：

$("form input:in-range").each(function () {
    // Do something
});

但是，唉！没有:range 选择器。

【讨论】：