HTML5范围选择器 - 不支持的伪类：range

Question

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

我使用了以下代码：

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

由于某些原因，我遇到了以下错误：

! Uncaught Error: Syntax error, unrecognized expression: unsupported pseudo: range

可能重要的是：我使用 jquery-1.12.1.min.js。

有人知道这是为什么以及我该如何解决吗？

- Rotan075

---

错误指出了确切的问题，jQuery 中没有 :range 选择器。 - Rory McCrossan

请阅读此帖子：https://dev59.com/4Wkw5IYBdhLWcg3wSogs - d.danailov

Answer 1

试试这个：

jQuery("input[type=range]")

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

例如：只有当用户将光标放在元素上时，:hover才会生效，:visible表示用户可以看到的元素。 编辑 Pranav C Balan的答案更好地解释了发生了什么：HTML5 range - unsupported pseudo: range。

- Emil S. Jørgensen

Answer 2

在 CSS 或 jQuery 中没有:range 伪选择器。相反，您可以使用属性等于选择器

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

---

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

- Pranav C Balan

Answer 3

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

jQuery("input[type=range]")

可以使用:in-range或:out-of-range CSS选择器来限制最小和最大值范围：

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

但是，遗憾的是！没有:range选择器。

- Bhojendra Rauniyar