52

I cant seem to get the following working:

$('input:not([type=radio][type=checkbox])').live('click', function() {
    alert("You haven't clicked a radio or checkbox!");
});

Have tried a few different syntax's, can anyone help me out on this one.

Cheers
Charlie

Charlie Sheather
  • 2,374
  • 6
  • 20
  • 21
  • 1
    possible duplicate of [jQuery - multiple :not selector](http://stackoverflow.com/questions/7144976/jquery-multiple-not-selector) – Adriano Mar 12 '15 at 10:37

3 Answers3

91

You're confusing the multiple selector with the multiple attribute selector. You should write:

$("input:not([type=radio], [type=checkbox])");

The multiple attribute selector [type=radio][type=checkbox] matches the elements whose type attributes are equal to both radio and checkbox, which cannot happen in this universe.

Frédéric Hamidi
  • 258,201
  • 41
  • 486
  • 479
  • Perfect!, thanks Frédéric. Seems as though I was mistaking those. Bookmarked :) – Charlie Sheather May 29 '11 at 09:23
  • 1
    I think it would be more true to say "cannot happen in this implementation of html" rather than trying to speak for the whole universe. It's a big* universe, some alien race may have an html implementation which allows a comma-separated list of values for a given attribute, for example. (*many cosmologists believe that the universe is actually infinite, in which case any implementation of html you could think of will exist somewhere) – Max Williams May 07 '15 at 11:52
5

The syntax inside the not() is identical to the normal selector syntax, so if you want to match things that are not either of those things, you use a selector in the not that would match both (since essentially you're negating the selector). How do you do that? The same way you apply styles to multiple selectors at once in CSS, with a comma, as so:

$('input:not([type=radio],[type=checkbox])')

That should select all inputs the not [type=radio] and not [type=checkbox]

darkliquid
  • 4,003
  • 1
  • 25
  • 17
  • 3
    Note that this only applies to jQuery's `:not()`. CSS3's `:not()` cannot accept anything but a [simple selector](http://www.w3.org/TR/css3-selectors/#simple-selectors-dfn). As such, if you pass anything more than a simple selector to `:not()` in jQuery, modern browsers can't parse the selector with `querySelectorAll()` so there may be a performance hit (if a microscopic one). – BoltClock May 29 '11 at 10:03
  • Yes, thanks for that clarification, my CSS comparison didn't make it clear that the CSS3 not selector _doesn't_ work that way. – darkliquid May 31 '11 at 12:09
4

You can also exclude items like this:

$('input').not('[type=radio], [type=checkbox]').live('click', function() {
    alert("You haven't clicked a radio or checkbox!");
});
Junaid Anwar
  • 844
  • 1
  • 9
  • 22