Есть ли единственный способ css или html запретить пользователю вводить текст в поле ввода?

Я хочу динамически добавлять элементы и удалять элементы и т. Д. В поле ввода, но я не хочу, чтобы пользователь мог его редактировать, а использование атрибута disable в теге html не позволяет мне делать то, что Я хочу.

0
pourmesomecode 8 Сен 2016 в 18:13

6 ответов

Лучший ответ

Вы можете использовать атрибут readonly или disabled.

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

Скорее всего, вам понадобится readonly. Который можно легко стилизовать под отключенный элемент.

document.getElementById('test').value = 'Hello World!';
[readonly] {
  border: 1px solid #ccc;
  background-color: #eee;
}
<input type="text" id="test" name="test" readonly>
3
hungerstar 8 Сен 2016 в 15:29

Вы можете имитировать отключенный эффект с помощью CSS.

pointer-events:none;

Вы также можете изменить цвета и т. Д.

CSS не предназначен для изменения поведения элементов формы. Это предназначено только для изменения их стиля. Скрытие текстового поля не означает, что текстового поля больше нет или что браузер не будет отправлять свои данные при отправке формы. Все, что он делает, это скрывает это от глаз пользователя.

Чтобы фактически отключить поля, необходимо использовать атрибут disabled в HTML или свойство disabled DOM в JavaScript.

ИЛИ JQUERY

$('#fieldname').attr('disabled', 'disabled'); //Disable
$('#fieldname').removeAttr('disabled'); //Enable
0
Stivan 8 Сен 2016 в 15:17

Да, вы можете просто установить для свойства disabled элемента ввода значение true. Это не позволит пользователю изменять его содержимое, но вы можете делать с ним все, что захотите, используя Javascript для изменения его свойства value.

1
DRAB 8 Сен 2016 в 15:16

Вы можете использовать атрибут readonly - прочтите об этом здесь

1
The One and Only ChemistryBlob 8 Сен 2016 в 15:16

Добавить к нему только для чтения

<input type="text" value="Hello" readonly />
1
Rudi Urbanek 8 Сен 2016 в 15:19

Гм .....

<input type="text" name="myInput" value="Whatever" readonly="readonly" />

Подробнее здесь: Каков правильный синтаксис атрибута только для чтения для элементов ввода текста?

0
Community 23 Май 2017 в 12:01