Как сделать ввод текста нередактируемым?

Итак, у меня есть текстовый ввод

<input type="text" value="3" class="field left">

Вот мой CSS для него

background:url("images/number-bg.png") no-repeat scroll 0 0 transparent;
border:0 none;
color:#FFFFFF;
height:17px;
margin:0 13px 0 0;
text-align:center;
width:17px;

Есть ли настройка или трюк, я думал о том, чтобы делать ярлык, но как насчет стиля. Как мне их преобразовать и есть ли лучший способ или это единственный способ?

Ответы

Ответ 2

Вы можете добавить атрибут readonly к вводу:

<input type="text" value="3"
       class="field left" readonly="readonly">

Дополнительная информация: http://www.w3schools.com/tags/att_input_readonly.asp

Ответ 3

Вы можете использовать атрибут readonly, если вы хотите, чтобы ваш ввод был прочитан только. И вы можете использовать атрибут disabled, если вы хотите, чтобы ввод отображался, но полностью отключен (даже такие языки, как PHP, не смогут их прочитать).

Ответ 4

Просто чтобы получить ответы:

Элемент ввода может быть либо readonly, либо отключен (ни один из них не доступен для редактирования, но есть несколько отличий: focus,...)

Хорошее объяснение можно найти здесь:
Какая разница между disabled = "disabled" и readonly = "readonly" для полей ввода HTML-формы?

Как использовать:

<input type="text" value="Example" disabled /> 
<input type="text" value="Example" readonly />

Есть также некоторые решения, чтобы сделать это через CSS или JavaScript, как описано здесь.

Ответ 5

<input type="text" value="3" class="field left" readonly>

Вы можете видеть в https://www.w3schools.com/tags/att_input_readonly.asp

Метод установки "readonly":

$("input").attr("readonly", true)

чтобы отменить "readonly" (работа в jQuery):

$("input").attr("readonly", false)

Ответ 6

добавить атрибут readonly

<input type="text" value="3" class="field left" readonly="readonly" >

или -

<input type="text" value="3" class="field left" readonly>

не нужен css!

Ответ 7

вам просто нужно добавить отключить в конце

<input type="text" value="3" class="field left" disabled>

Ответ 8

Добавьте readonly:

<input type="text" value="3" class="field left" readonly>

Если вы хотите, чтобы значение не отправлялось в форме, вместо этого добавьте атрибут disabled.

<input type="text" value="3" class="field left" disabled>

Нет способа использовать CSS, который всегда работает для этого.

Почему? CSS не может ничего "отключить". Вы все еще можете отключить отображение или видимость и использовать pointer-events: none, но pointer-events не работает на версиях IE, которые вышли ранее, чем IE 11.