<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<button id="btn">加锁</button>
<button id="btn2">解锁</button>
<script>
var oBtn = document.getElementById('btn');
var oBtn2 = document.getElementById('btn2');
oBtn.addEventListener('click',function(){
oBtn.setAttribute('disabled',true)
})
oBtn2.addEventListener('click',function(){
oBtn.setAttribute('disabled',false)
})
</script>
</body>
</html>
//点击加锁以后,给当前dom元素添加了disabled=“true”属性。如下<button id="btn" disabled="true">加锁</button>
//点击解锁以后,给当前dom元素添加了disabled=“false”属性。如下<button id="btn" disabled="false">加锁</button>
但是。真正能起到效果的是下面的写法。
`
oBtn.addEventListener('click',function(){
oBtn.setAttribute('disabled',true)
})
oBtn2.addEventListener('click',function(){
oBtn.removeAttribute('disabled')
})
`
综上所述,后来我查看了关于HTMLdom元素官方文档。说的是只有设置
disabled=“disabled”,或者就单一的disabled(目前很多浏览器都支持简写方式)才能将按钮禁用。至于如何设置回来,官网没说。但是实际上可以通过移除这个属性来达到效果。
对于经常写vue和react以及小程序等框架的来说,因为很容易弄混,所以这一点必须清楚。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。