javascript jQuery 支持 ":invalid" 选择器
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15820780/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery support ":invalid" selector
提问by jldupont
I get the following console message:
我收到以下控制台消息：
[16:04:01.292] Error: Syntax error, unrecognized expression: unsupported pseudo: invalid @ http://localhost:8080/assets/js/jquery-1.9.1.min.js:4
When I try something like:
当我尝试类似的事情时：
if( $(e.target).is(':invalid') ){ ... }
if( $(e.target).is(':invalid') ){ ... }
How do I fix this?
我该如何解决？
Here's an example: http://jsfiddle.net/L4g99/- try changing the jQuery version (stops working after 1.9)
这是一个示例：http: //jsfiddle.net/L4g99/- 尝试更改 jQuery 版本（1.9 后停止工作）
回答by adeneo
Using querySelectorAllas suggested by @JanDvorak (and his answer should be accepted for thinking of that), you can write your own expression, making .is(':invalid')valid ?
querySelectorAll按照@JanDvorak 的建议使用（考虑到这一点，应该接受他的回答），您可以编写自己的表达式，使.is(':invalid')?
jQuery.extend(jQuery.expr[':'], {
invalid : function(elem, index, match){
var invalids = document.querySelectorAll(':invalid'),
result = false,
len = invalids.length;
if (len) {
for (var i=0; i<len; i++) {
if (elem === invalids[i]) {
result = true;
break;
}
}
}
return result;
}
});
now you can do :
现在你可以这样做：
if( $(e.target).is(':invalid') ){ ... }
回答by John Dvorak
:invalidis, indeed, not a valid jQuery selector (pseudoclass).
:invalid实际上，它不是有效的 jQuery 选择器（伪类）。
According to the link you posted, however, it is a valid CSS selector (not supported in IE<10).
但是，根据您发布的链接，它是一个有效的 CSS 选择器（在 IE<10 中不受支持）。
A fiddle by Adeneoshows that, as suspected, while it doesn't work in jQuery, it can be used via the native querySelector/querySelectorAllmethods. So, while this doesn't work:
Adeneo 的一个小提琴表明，正如所怀疑的那样，虽然它在 jQuery 中不起作用，但可以通过本机querySelector/querySelectorAll方法使用。所以，虽然这不起作用：
if($(e.target).is(":invalid")) //SyntaxError
This does (except in IE<10):
这样做（IE<10 除外）：
if(~[].indexOf.call(document.querySelectorAll(":invalid"),e.target))
This should work as well (in the future or after the neccessary shimming; see caniuse):
这也应该有效（在未来或在必要的匀场之后；参见caniuse）：
if(e.target.matches(":invalid"))
回答by Nikita Malyavin
You can use element's validityattribute (see MDN).
您可以使用元素的validity属性（请参阅MDN）。
Now combining it with @adeneo's idea:
现在将它与@adeneo 的想法结合起来：
jQuery.extend(jQuery.expr[':'], {
invalid : function(elem, index, match){
return elem.validity !== undefined && elem.validity.valid === false;
},
valid : function(elem, index, match){
return elem.validity !== undefined && elem.validity.valid === true;
}
});
