• 完善 购物车统计价格 总价数量


    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <script>
        window.onload=function(){
            var aIn=document.querySelectorAll('input');
            var aEm=document.querySelectorAll('em');
            var aI=document.querySelectorAll('i');
            for(var i=0;i<aIn.length;i++){
                (function(index){
                    if(aIn[index].value=='0'){
                            delete localStorage['a'+index];
                     }
                    aIn[i].oninput=function(){
                        aI[index].innerHTML=parseFloat(aEm[index].innerHTML)*parseFloat(aIn[index].value);
                        localStorage['a'+index]=parseFloat(aEm[index].innerHTML)*parseFloat(aIn[index].value);    
                        getStorage();
                    };
    
                })(i);    
           }
           //获取后台存取的信息。
           function getStorage(){
                   var arr=[];
                function findArr(){
                       for(var name in localStorage){
                           var reg=/^[a]d+$/g;
                           if(reg.test(name)){
                               arr.push(localStorage[name]);
                           }    
                    }
                    return arr;
                }
                var d=findArr();
                var p=0;
                for(var i=0;i<d.length;i++){
                    var p=Number(d[i])+p;
                    div1.innerHTML='总价:'+p;
                }
            }
           
        };
        </script>
    </head>
    <body>
        <div>
            <p>商品名称:碧血剑谱</p>
            <input type="number" min="0" value="0">
            <em>30$</em><br><br>
            <i></i>
        </div>
        <div>
            <p>商品名称:九阴真经</p>
            <input type="number" min="0" value="0">
            <em>60$</em><br><br>
            <i></i>
        </div>
        <div>
            <p>商品名称:太极拳谱</p>
            <input type="number" min="0" value="0">
            <em>90$</em><br><br>
            <i></i>
        </div>
        <div id="div1">0</div>
    </body>
    </html>
  • 相关阅读:
    git cherrypick 小结
    git 忽略机制
    git revert 小结
    git 忽略机制
    学习 原理图2 电源电路
    git merge 和 git rebase 小结
    git cherrypick 小结
    学习 原理图2 电源电路
    git revert 小结
    使用SMTP发送邮件
  • 原文地址:https://www.cnblogs.com/lixuekui/p/5947119.html
Copyright © 2020-2023  润新知