xxxxxxxxxx
<input type="text" id="myInput" disabled>
xxxxxxxxxx
<!-- using the disabled attribute prevents the end user from entering text into the input box -->
<input type="text" disabled />
<!-- text input is allowed, as it doesn't contain the disabled attribute -->
<input type="text" />
xxxxxxxxxx
<input type="text" id="myInputField" value="Editable content">
<button onclick="disableInput()">Disable Input</button>
<script>
function disableInput() {
var input = document.getElementById("myInputField");
input.disabled = true;
}
</script>