HTMLInputElement: readOnly プロパティ

readOnly は HTMLInputElement インターフェイスのプロパティで、<input> の値をユーザーが変更できないことを示します。これは <input> 要素の readonly 論理属性を反映したもので、属性が存在する場合は true を返し、省略されている場合は false を返します。

disabled プロパティが true であるフォームコントロールとは異なり、readOnly プロパティが true の値である場合、クリックやコントロール内の選択ができなくはなりません。

HTML の readonly 属性は、型が hidden、range、color、checkbox、radio、file、submit、reset、button、image の場合には無視されますが、これらの入力型では、属性が存在する場合は readOnly プロパティが true、それ以外は false となります。

const inputElement = document.getElementById("total");
console.log(inputElement.readOnly);
inputElement.readOnly = true;