使用 JavaScript 使文本框可编辑答案

【问题标题】：Make text box editable using JavaScript使用 JavaScript 使文本框可编辑
【发布时间】：2011-02-16 12:19:09
【问题描述】：

我有一个带有readonly="readonly" 的文本框，这意味着我无法对其进行编辑。但我想要的是让这个文本框在用户双击它时可编辑。

我尝试过的是：

<input size="10" readonly="readonly" ondblclick="setEditable(this)"/>

在 JavaScript 中：

 function setEditable(i){
     i.readonly = false;
 }

但这不起作用。那么当用户双击文本框时，我怎样才能使文本框可编辑，它是只读的？

【问题讨论】：

【解决方案1】：

更新：

再次使其只读：

var el = document.getElementById('txt');
el.onblur = function(){
  this.setAttribute('readonly');
};

你可以这样做：

<input size="10" readonly="readonly" id="txt" />

JS：

var el = document.getElementById('txt');
el.ondblclick = function(){
  this.removeAttribute('readonly');
};

【讨论】：

【解决方案2】：

如上 sarfraz 的纯 javascript 示例，尝试使您的 javascript 不显眼更好的做法

如果你现在页面上有 jquery，很多人都会这样做，你可以用它来做同样的事情

在jquery中

$('#txt').removeAttr("readonly");

【讨论】：

【解决方案3】：

使文本字段可编辑

document.getElementById("TextFieldId").readOnly=true;

使文本字段不可编辑

document.getElementById("TextFieldId").readOnly=false;

【讨论】：