切换禁用的文本输入 onclick

【问题标题】：Toggle disabled text input onclick切换禁用的文本输入 onclick
【发布时间】：2018-11-11 09:29:37
【问题描述】：

在输入框被禁用之前，我的代码运行良好，并且当输入框处于禁用模式时，onclick 不会触发任何内容。

很简单:)

html:

<input id=toggleMe>

javascript：

var toggleMe=document.getElementById("toggleMe");

toggleMe.onclick=function(){if(toggleMe.disabled==false){toggleMe.disabled=true;}else{toggleMe.disabled=false;}}

jsfiddle:

https://jsfiddle.net/45cx6rwv/

【问题讨论】：

在这里稍作改进：您可以摆脱toggleMe.onclick=function(){toggleMe.disabled=!toggleMe.disabled} 的if 声明

标签： javascript html if-statement input onclick

【解决方案1】：

您不能点击禁用的元素。您可以使用一个类来设置元素的 readOnly 属性：

document.getElementById('toggleMe').addEventListener('click', function(){
  this.classList.toggle("disabled");
  if(this.classList.value.includes('disabled')){
        this.readOnly = true;
    } else {
        this.readOnly = false;
    }
});

.disabled{
    background-color: #DDD;
    color: #999;
}

&lt;input id="toggleMe"&gt;

【讨论】：

帅哥！但我没有使用 jQuery... :D
this.classList.toggle("disabled") 不是更好的解决方案吗？
@Hezi-Gangina 没有 jquery。
@Hezi-Gangina，我错误地添加了该脚本....现在已删除....解决方案纯粹是在 JavaScript 上。