Question

我有以下输入：

<input type="text" value="John Smith" onClick="editUserName()" id="userNameInput" disabled>

它假设在用户点击它时激活，以便进行编辑：

var userNameInput = document.getElementById("userNameInput");
function editUserName () {
    userNameInput.disabled = false;
}

我尝试了disabled和disabled="disabled"，似乎没有任何影响。这有什么问题？

Answer 1

问题是它被禁用

尝试onmouseover

Answer 2

我认为您也可以删除该属性：

userNameInput.removeAttribute("disabled");

我相信当你将disabled属性设置为'disabled'时，它会将其禁用。

Answer 3

问题在于，disabled属性（至少在某些浏览器中）会阻止任何用户与该元素的交互。这意味着click和mouseover事件都不会在这些浏览器中注册。您可以采取的措施是创建自己的类，模仿disabled样式，以便仍然触发事件。

我已经做了一个 demo 的例子。

Answer 4

您可以将输入元素放在某个div中并捕获事件并删除已禁用的attribite。

<div onClick="editUserName()">
 <input type="text" value="John Smith" id="userNameInput" disabled>
</div>

var userNameInput = document.getElementById("userNameInput");
function editUserName () {
   userNameInput.removeAttribute("disabled");
}

演示：http://jsfiddle.net/27Syr/644/

如何在点击时启用输入框？

4 个答案: