HTML-значение «только для чтения» можно редактировать, если установлен флажок

Question

У меня есть вход <input type="text" value="1" readonly id='aaa'/>.

Я хотел бы дать ему функцию, когда пользователь установит флажок, затем сможет редактировать значение id=aaa.

Пример:

<input type="text" value="1" readonly/> <input type="checkbox" /> Checked this if you want to edit the value.

Спасибо.

Answer 1

Добавить событие onchange к флажку, который изменяется на атрибут readOnly его предыдущего брата (текстовое поле)

<input type="text" value="1" readonly id="aaa" />
<input type="checkbox" onchange="getElementById('aaa').readOnly = !this.checked" />
Checked this if you want to edit the value.

Answer 2

Вы хотите использовать JavaScript для изменения свойства readOnly.Установите значение, противоположное установленному флажку.

document.getElementById('checksome').addEventListener('click', function() {

  var changeThis = document.getElementById('readsome');

  changeThis.readOnly = !this.checked;
});

<input id="readsome" type="text" value="1" readonly>
<label><input id="checksome" type="checkbox"> Click this to edit</label>