Jak wyłączyć typ danych wejściowych = tekst?

Question

Chcę wyłączyć zapisywanie w polu wejściowym typu text przy użyciu JavaScript, jeśli to możliwe. Pole wejściowe jest wypełniane z bazy danych; dlatego nie chcę, aby użytkownik zmieniał jego wartość.

Answer 1

Jeśli znasz to, kiedy strona jest renderowana, co brzmi tak, jak robisz, ponieważ baza danych ma wartość, lepiej ją wyłączyć po renderowaniu zamiast JavaScript. Aby to zrobić, wystarczy dodać atrybut readonly (lub disabled, jeśli chcesz, aby usunąć je z przesyłania formularzy, jak również) do <input>, tak:

<input type="text" disabled="disabled" /> 
//or... 
<input type="text" readonly="readonly" /> 

Answer 2

Pobierz odwołanie do Twojej skrzynki wejściowej jednak chcesz (np document.getElementById('mytextbox')) i ustawić jej readonly nieruchomość do true:

myInputBox.readonly = true; 

Alternatywnie można po prostu dodać tę właściwość inline (nie wymaga JavaScript):

<input type="text" value="from db" readonly="readonly" /> 

Answer 3

Jeśli dane są wypełniane z bazy danych, to może rozważyć nie przy użyciu znacznika <input>, aby go wyświetlić. Niemniej jednak, można go wyłączyć bezpośrednio w tagu:

<input type='text' value='${magic.database.value}' disabled> 

Jeśli trzeba wyłączyć go z JavaScript później, można ustawić „wyłączone” atrybut:

document.getElementById('theInput').disabled = true; 

Powodem nie sugerujemy pokazujący wartość jako <input> polega na tym, że z mojego doświadczenia wynikają problemy z układem. Jeśli tekst jest długi, to użytkownik musi spróbować przewinąć tekst, co nie jest czymś, co zwykli ludzie mogliby odgadnąć. Jeśli po prostu wrzucisz go do modelu <span>, uzyskasz większą elastyczność w stylizacji.

Answer 4

document.getElementById('foo').disabled = true; 

EDIT

lub

document.getElementById('foo').readOnly = true; 

Zauważ, że readOnly powinny być w CamelCase pracować poprawnie w Firefoksie (magii).

Answer 5

Można również przez jquery:

$('#foo').disabled = true;