在《jQuery插件Flip》的第二个例子中 （查看 Demo），写过滤选择器的时候，发现在 IE 下有问题，无法过滤。代码是这样的：

$('.flipbox:not(:first)').hide();

代码在非 IE 浏览器下没有问题，即除了第一个含有 flipbox 类的元素外，其他的隐藏，但在 IE 里却全部隐藏了。

经过测试，除了上面的写法在 IE 下有问题外，下面的几种写法在 IE 下也有问题：

$('.flipbox:not(:first)');
$('.flipbox:not(:last)');
$('.flipbox:not(:even)');
$('.flipbox:not(:odd)');
$('.flipbox:not(:eq(1))');
$('.flipbox:not(:gt(1))');
$('.flipbox:not(:lt(1))');

很奇怪的是：如果把 className 换成 tagName，如上面把 .flipbox 换成对应的标签名，又不会出现问题。当然，换成标签名的话，你要确定不会选择到其他不需要选择的标签，以免产生混乱，出现其他问题。

对于这个问题，我的办法有两个：

1. 与样式结合，改变写法
2. 用 .ont 代替 :not

对于第一种方法，我们可以在样式里定义：

.flipbox { display:none}

而 jQuery 代码则写成：

$('.flipbox:first').show();

但是这种方法的可访问性低，如果访客禁止了 javascript，那他看不到主要内容。

对于第二种方法，jQuery 代码可写成：

$('.flipbox').not($(.flipbox:first).show();

这种方法的可访问性较好，即使访客禁止了 javascript，但他能看到所有内容。所以最后我选择了这种方法。

这里做了一个综合的例子，你可以在 IE 和非 IE 浏览器下看看他们的不同，查看 Demo

其实还有一个奇怪的现象，就是某种情况下给类选择器前面加上标签名，也不会出现问题，而这种情况就是这些类不能被相同的标签包裹。查看 Demo

很巧，在浏览愚人码头的博客的时候发现他早就发现了这个问题，并且也提出了解决方法，有兴趣的可以点击这里查看。

Original article: jQuery过滤选择器:not在IE中的bug

©2015 一起CSS. All Rights Reserved.