1.實作
點選"+" - > 數字+1 - > 點選"-" - >數字-1 -> 數字=1 - > "-"号禁用
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
div {
width: 80px;
}
input[type=text] {
width: 50px;
height: 44px;
outline: none;
border: 1px solid #ccc;
text-align: center;
border-right: 0;
}
input[type=button] {
height: 24px;
width: 22px;
cursor: pointer;
}
input {
float: left;
border: 1px solid #ccc;
}
</style>
</head>
<body>
<div>
<input type="text" id="total" value="1" readonly>
<input type="button" value="+" id="add">
<input type="button" value="-" id="reduce" disabled>
<script>
// 需求：加減操作 減到1 -按鈕禁用
// 擷取标簽
let theText = document.querySelector('#total')
let addBtn = document.querySelector('#add')
let redBtn = document.querySelector('#reduce')
// 綁定點選事件
addBtn.addEventListener('click',function() {
theText.value = +theText.value + 1
// -取消禁用
redBtn.disabled = false
})
// 減法綁定點選事件
redBtn.addEventListener('click', function() {
theText.value = +theText.value - 1
// 減到1時 -禁用
if(+theText.value === 1 ) {
redBtn.disabled = true
}
})
// 金句：
// 普通用innerHTML
// input用value
</script>
</div>
</body>
</html>
![nodejs微信開發---授權登入+擷取使用者資訊微信網頁授權[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)