Selector de CSS para tipo de entrada deshabilitado = "enviar"


76

¿Hay un selector de CSS para discapacitados input type="submit"o "button"?

¿Debería usar input[type="submit"][disabled]?

¿Eso funciona en IE6?


4
:disabledpuede ser mejor, en CSS3. Sin embargo, IE tampoco es compatible, por lo que necesitará una clase de respaldo.
Bobince

Gracias, buen punto, pero planeo mantenerme alejado de CSS3 por ahora.
Francisc

13
Los desarrolladores realmente necesitan dejar de intentar admitir IE6. Y los propietarios / administradores de sitios realmente deben dejar de pedirles a los desarrolladores que lo apoyen. Vamos gente - ¡IE9 está saliendo ahora!
Spudley

1
Bueno, considerando que el 24% de los usuarios de mi cliente provienen de IE6, lamentablemente no puedo ignorarlo por ahora. IE9 es genial, pero no funciona en Windows XP, por ejemplo.
Francisc

2
El 24% está por encima del promedio para IE6 en estos días, pero sí, si tiene ese tipo de estadística con la que debe lidiar. Sin embargo, no significa que tenga que hacer que todo se vea perfecto, siempre que la funcionalidad funcione. Por lo que vale, estamos viendo alrededor del 17%, y hemos tomado la decisión de eliminar activamente el soporte en nuestra próxima renovación del sitio.
Spudley

Respuestas:


114

¿Eso funciona en IE6?

No, IE6 no admite selectores de atributos en absoluto, cf. Compatibilidad CSS e Internet Explorer .

Puede encontrar una solución alternativa: IE6 no admite selectores de "atributos" de CSS que valgan la pena leer.


EDITAR
Si va a ignorar IE6, puede hacer (CSS2.1):

input[type=submit][disabled=disabled],
button[disabled=disabled] {
    ...
}

CSS3 (IE9 +):

input[type=submit]:disabled,
button:disabled {
    ...
}

Usted puede sustituir [disabled=disabled](valor de atributo) con [disabled](presencia de atributos).


Ok, gracias. Pero si ignorara IE6, ¿cómo se lograría? ¿La entrada [type = "button" [disabled] sería estándar?
Francisc

Gracias de nuevo por el primer enlace, Compatibilidad CSS e Internet Explorer - EXCELENTE ARTÍCULO, marcador instantáneo.
Francisc

1
@SuperUberDuper El enfoque basado en atributos funcionará en IE8 (que no es IE6 ni IE9 +). Tanto IE7 como IE8 admiten algunos selectores CSS2.1 y CSS3, siendo uno de ellos el valor / presencia del atributo.
jensgram

2

Como dice jensgram, IE6 no es compatible con el selector de atributos. Puede agregar class = "disabled" para seleccionar las entradas deshabilitadas para que esto pueda funcionar en IE6.


0

Usé la solución @jensgram para ocultar un div que contiene una entrada deshabilitada. Entonces oculto todo el padre de la entrada.

Aquí está el código:

div:has(>input[disabled=disabled]) {
    display: none;
}

Quizás podría ayudar a algunos de ustedes.

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.