用js实现按钮加减，减到0停止

谁践踏了优雅 2022-07-14 11:48 148阅读 0赞

html代码如下：

css代码如下：

.button {
        background-color: white;
        border: 4px solid #ACB4BE;
        color: #536277;
        display: inline-block;
        float: right;
        font-size: 30px;
        padding: 8px 21px;
        text-align: center;
        text-decoration: none;
        &:nth-child(3) {
            border-bottom-left-radius: 10px;
            border-top-left-radius: 10px;
            border-right: 0;
            color: #A9B1BB;
        }
        &:nth-child(1) {
            border-bottom-right-radius: 10px;
            border-top-right-radius: 10px;
            border-left: 0;
        }
    }

js代码如下：

window.οnlοad=function(){
        		var count=1;
                 var count1=1;
        		var adult=document.getElementById("btn1");
                var adcount=document.getElementById("btn2");
                var adco=document.getElementById("btn3");
    
                var child=document.getElementById("btn4");
        		var chcount=document.getElementById("btn5");
                var chco=document.getElementById("btn6");
    
                    adult.οnclick=function(){
                       
                    count++;
                    adcount.innerHTML=count;
                      adco.οnclick=function(){
                    if(count>0){
                       count--;
                    adcount.innerHTML=count; 
                }else{
                    adcount.innerHTML=0;
                }
           }
                   
        }  
       
            child.οnclick=function(){
                    count1++;
                    chcount.innerHTML=count1;
                chco.οnclick=function(){
                    if(count1>0){
                    count1--;
                    chcount.innerHTML=count1;  
                    }else{
                    chcount.innerHTML=0;
                    }
                }         
                    
            }
        }

小白自己写的，可能有点简单的复杂化了，还请各位多多包涵![大笑][laugh.gif]

[laugh.gif]: /images/20220714/009597a84f504a7980f7f32b3214a444.png