jQuery支持":invalid"选择器

Question

我收到以下控制台消息:

[16:04:01.292] Error: Syntax error, unrecognized expression: unsupported pseudo: invalid @ http://localhost:8080/assets/js/jquery-1.9.1.min.js:4

当我尝试这样的事情:

if( $(e.target).is(':invalid') ){ ... }

我该如何解决？

这是一个例子:http://jsfiddle.net/L4g99/ - 尝试更改jQuery版本(在1.9之后停止工作)

Answer 1

使用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;
    }
});

现在你可以这样做:

if( $(e.target).is(':invalid') ){ ... }

小提琴

Answer 2

:invalid 确实,它不是一个有效的jQuery选择器(伪类).

但是,根据您发布的链接,它是一个有效的CSS选择器(IE <10不支持).

Adeneo的一个小提琴表明,尽管它在jQuery中不起作用,但它可以通过native querySelector/ querySelectorAllmethods使用.所以,虽然这不起作用:

if($(e.target).is(":invalid"))  //SyntaxError

这样做(IE <10除外):

if(~[].indexOf.call(document.querySelectorAll(":invalid"),e.target))

这也应该有效(将来或在必要的垫片之后;参见caniuse):

if(e.target.matches(":invalid"))