js动态设置input框不可编辑

在JavaScript中，可以使用input元素的readOnly属性或者disabled属性来设置输入框为不可编辑状态。

• 使用readOnly属性：

document.getElementById('myInput').readOnly = true;

• 使用disabled属性：

document.getElementById('myInput').disabled = true;

readOnly属性会使输入框显示为不可编辑状态，但是表单提交时会携带这个输入框的值。

disabled属性会使输入框完全不可点击不可编辑，且表单提交时不会包含这个输入框的值。

以下是具体的实例代码：

HTML部分：

<input type="text" id="myInput" value="我是不可编辑的输入框">
<button onclick="makeEditable()">设为可编辑</button>
<button onclick="makeNonEditable()">设为不可编辑</button>

JavaScript部分：

function makeEditable() {
  document.getElementById('myInput').readOnly = false;
  document.getElementById('myInput').disabled = false;
}
 
function makeNonEditable() {
  document.getElementById('myInput').readOnly = true;
  document.getElementById('myInput').disabled = true;
}

在这个例子中，点击“设为不可编辑”按钮会使输入框不可编辑，点击“设为可编辑”按钮则会恢复输入框的可编辑状态。