#8039 closed bug (fixed)
Selectors with new HTML(5) input types don’t work in <= IE7
Reported by: | mathias | Owned by: | gnarf |
---|---|---|---|
Priority: | low | Milestone: | 1.5.1 |
Component: | selector | Version: | 1.5 |
Keywords: | Cc: | ||
Blocked by: | Blocking: | #8163 |
Description
HTML:
<input type="search">
jQuery:
$('input[type="search"]').length; // should be 1, but is 0 in <= IE7 $('input[type="text"]').length; // should be 0, but is 1 in <= IE7 $('input').attr('type'); // should be "search", but is "text" in <= IE7 document.getElementsByTagName('input')[0].getAttribute('type'); // "search" (works everywhere)
It seems jQuery is using elem.type
internally instead of elem.getAttribute('type')
. In this case, there’s an important difference.
I’ve created a jsFiddle to illustrate the bug: http://jsfiddle.net/mathias/XzGcW/ Note that it uses alert()
so it can be debugged in a clean IE without any plugins installed.
P.S. This does not fix the bug, but I think that in src/selector.js
, around line 613, this should be rewritten to elem.getAttribute('type')
to prevent similar bugs with :text
:
text: function( elem ) { return "text" === elem.type; }
Change History (12)
comment:2 Changed 12 years ago by
One fix is to add a special case for the 'type' ATTR check that will force .getAttribute:
Sizzle.selectors.attrHandle['type'] = function ( elem ) { return elem.getAttribute( 'type' ); }
( change Sizzle
to jQuery.find
and you can monkey patch this bug on your own page: seen on http://jsfiddle.net/gnarf/XzGcW/2/ )
Also, I'm not really sure why the default behavior in the attr function around ~790 of sizzle.js prefers to use elem[ name ]
over elem.getAttribute( name )
but switching this to prefer elem.getAttribute
may fix the need to have attrHandle
at all since both the current one (href) and the proposed one for type just return .getAttribute()
comment:3 Changed 12 years ago by
Component: | unfiled → attributes |
---|---|
Owner: | set to mathias |
Status: | new → pending |
I just applied this change and failed the following...
attributes: attr(String) (5, 14, 19)
- Check for defaultValue attribute
- Check for class attribute
- Check for selectedIndex attribute
- Died on test #18: Cannot call method 'toUpperCase' of null
attributes: attr(String, Object) (1, 29, 30)
- Remove name attribute
attributes: addClass(String) (3, 2, 5)
- Make sure there's no extra whitespace.
- Make sure there's no extra whitespace.*
- Make sure there isn't too much trimming.
attributes: addClass(Function) (3, 2, 5)
- Make sure there's no extra whitespace.
- Make sure there's no extra whitespace. *
- Make sure there isn't too much trimming.
- yes, both named this
comment:4 Changed 12 years ago by
Component: | attributes → selector |
---|---|
Priority: | undecided → low |
Status: | pending → open |
comment:6 Changed 12 years ago by
I can confirm that gnarf’s patch successfully fixes the problem, while passing all unit tests in all supported browsers, including IE7 and IE6.
comment:7 Changed 12 years ago by
Owner: | changed from mathias to gnarf |
---|---|
Status: | open → assigned |
Version: | git → 1.5rc1 |
comment:8 Changed 12 years ago by
Milestone: | 1.next → 1.5.1 |
---|
comment:9 Changed 12 years ago by
Version: | 1.5rc1 → 1.5 |
---|
comment:11 Changed 12 years ago by
Blocking: | 8163 added |
---|
comment:12 Changed 12 years ago by
Resolution: | → fixed |
---|---|
Status: | assigned → closed |
In
src/attributes.js
, near the end ofattr
(around line 346):…should probably be:
This fixes the
.attr()
issue, but not the selector bug.Edit: Of course, this change causes errors with
className
etc, see comment 3 by rwaldron.