input[type=“range”] selector isn't working in IE7

Question

I have several range inputs that I have to make consistent across browsers so I am using jQuery UI slider for them. The problem is not with that part, but actually with getting those elements.

This is how the inputs look:

<input type="range" name="..." value="..." min="..." max="..." />

Selecting them with input[type="range"] works in every browse besides IE7 (IE8 is fine). The code should run on Wordpress 3.1, so I have to use jQuery 1.4.

I've currently solved it by adding a class to the range inputs and that works fine, but I was wondering what is the problem with this selector in IE7?

Answer 1

IE7 and lower will automatically convert to type="text" . Try this and you will see

alert($('input').attr('type')); // alerts "text"

Therefore your selector doesn't match.

You could add data-type instead of a class only for jQuery selection

<input data-type="range" type="range" name="..." value="..." min="..." max="..." />

and use

$('input[data-type="range"]')

Answer 2

IE 7 supports a limited set of attribute selectors . Furthermore, it probably doesn't recognize input type="range" .

Answer 3

像ie6这样的ie7已经成为过时的浏览器，因此您不应该期望它支持type=range 。