¿Cómo agotar una casilla de verificación html?

Question

Quiero hacer solo checkbox. De esta manera:

<input type="checkbox" onclick="return false;"> 

Quiero que la casilla de verificación parezca deshabilitada o atenuada.

¿Cómo puedo hacer esto?

Answer 1

tiene que desactivar la casilla de verificación también:

<input type="checkbox" onclick="return false;" disabled="disabled"> 

Para contabilizar el valor, basta con que sea de sólo lectura en su lugar:

<input type="checkbox" onclick="return false;" readonly="readonly"> 

puede etiquetar casilla estilo y entradas de sólo lectura con CSS, por ejemplo: entrada [readonly = "readonly"] {} pero el navegador debe hacer que la casilla de verificación aparezca atenuada cuando se establece en solo lectura.

Actualizado:

Usted está en la merced del navegador cuando se labra casillas de verificación & al estilo de ellos consistente en todos los navegadores, hay que recurrir a las imágenes por ejemplo: http://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/

si no' t desea hacer esto (y parece una solución longwinded), la solución más simple es desactivar la casilla para que aparezca correctamente, y publicar el valor como una entrada oculta, por ejemplo:

<input type="checkbox" onclick="return false;" disabled="disabled"> 
<input type="hidden" name="checkboxval" value="111" /> 

Answer 2

sólo tiene que añadir el atributo 'desactivado' en la casilla de verificación de la misma familia

<input type="checkbox" disabled="disabled" /> 

Answer 3

<input type="checkbox" class="readonly"> 

Css

input.readonly { 
    opacity : .50; 
    filter : alpha(opacity=50); /* IE<9 */ 
    cursor : default; 
} 

js

$('input.readonly').on('click', function(evt) { 
    evt.preventDefault(); 
} 

Añadir una clase readonly al elemento que desea aparece en gris : a través de css estableces un opacity y cambias el estilo de cursor. A continuación, elimine el javascript en línea y evite la acción predeterminada para los elementos input.readonly al hacer clic en evento

Answer 4

Modo simple, solo CSS para desactivar una casilla deshabilitada.

input[type=checkbox][disabled] { 
    filter: invert(25%); 
}