Come aggiungere un attributo "readonly" a <input>?

Question

Come posso aggiungere readonly a uno specifico <input>? .attr('readonly') non funziona.

Answer 1

jQuery < 1,9

$('#inputId').attr('readonly', true); 

jQuery 1.9+

$('#inputId').prop('readonly', true); 

Per saperne di più difference between prop and attr

Answer 2

.attr('readonly', 'readonly') dovrebbe fare il trucco. Il tuo .attr('readonly') restituisce solo il valore, non ne imposta uno.

Answer 3

Credo che "disabile" esclude l'ingresso di essere inviato sul POST

Answer 4

Per abilitare in sola lettura:

$("#descrip").attr("readonly","true"); 

Per disabilitare in sola lettura

$("#descrip").attr("readonly",""); 

Answer 5

È possibile disattivare la sola lettura utilizzando la .removeAttr;

$('#descrip').removeAttr('readonly'); 

Answer 6

Uso $.prop()

$("#descrip").prop("readonly",true); 

$("#descrip").prop("readonly",false); 

Answer 7

Readonly è un attributo come definito in html, quindi trattarlo come uno.

È necessario avere qualcosa come readonly = "readonly" nell'oggetto su cui si sta lavorando se si desidera che non sia modificabile. E se vuoi che sia di nuovo modificabile non avrai qualcosa come readonly = '' (questo non è standard se ho capito bene). Hai davvero bisogno di rimuovere l'attributo nel suo complesso.

Come tale, mentre si utilizza jquery aggiungendolo e rimuovendolo è ciò che ha senso.

Set qualcosa in sola lettura:

$("#someId").attr('readonly', 'readonly'); 

Rimuovere sola lettura:

$("#someId").removeAttr('readonly'); 

Questa è stata l'unica alternativa che realmente ha funzionato per me. Spero che aiuti!

Answer 8

Utilizzare la proprietà setAttribute. Si noti ad esempio che se si seleziona 1 si applica l'attributo readonly sulla casella di testo, altrimenti si rimuove l'attributo readonly.

http://jsfiddle.net/baqxz7ym/2/

document.getElementById("box1").onchange = function(){ 
    if(document.getElementById("box1").value == 1) { 
    document.getElementById("codigo").setAttribute("readonly", true); 
    } else { 
    document.getElementById("codigo").removeAttribute("readonly"); 
    } 
}; 

<input type="text" name="codigo" id="codigo"/> 

<select id="box1"> 
<option value="0" >0</option> 
<option value="1" >1</option> 
<option value="2" >2</option> 
</select> 

Answer 9

Per jQuery versione 1.9 <:

$('#inputId').attr('disabled', true); 

Per la versione jQuery> = 1.9:

$('#inputId').prop('disabled', true);