A readOnly Equivalent para HTML Select Elements

Question

¿Existe un atributo o técnica para los campos de selección de HTML que sea equivalente a readOnly="true" para entradas HTML?

Tengo un campo de selección de formulario que me gustaría deshabilitar, pero aún lo transfiero cuando se publica el formulario. Si esto fuera una entrada HTML, que haría algo como esto

$('select_id').setAttribute('readOnly', 'true'); 

y el navegador haría que el campo no editable, pero su valor aún sería pasado al backend. Me gustaría algo similar para una selección HTML, pero haciendo lo siguiente

$('#select_id').setAttribute('readOnly', 'true'); 

no funciona. El atributo se ha agregado correctamente al DOM, pero el navegador aún lo muestra como seleccionable.

que se dan cuenta de que podía hacer lo siguiente

$('#input_id').disabled(); 

pero cuando un campo está desactivado su valor no se pasa a través de backend.

Me gustaría una forma de deshabilitar este campo de selección pero aún así pasar al back-end.

(ejemplos utilizan Prototipo JS, pero estoy interesado en ninguna solución general)

Answer 1

Desactivar todos, pero la opción seleccionada:

<select> 
<option disabled="disabled">1</option> 
<option selected="selected">2</option> 
<option disabled="disabled">3</option> 
</select> 

De esta manera el menú desplegable todavía funciona (y envía su valor) pero el usuario no puede seleccionar otro valor.

Answer 2

agregar la clase discapacitados:

.disabled{ 
    color: grey; 
} 

si la clase uso actual prevenir defecto en el enfoque y en el clic y, dbl clic:

$('#el').bind('click dblclick focus').function(event){ 
    if ($(this).hasClass('disabled')) event.preventDefault(); 
});