js循环除运算(计算套餐组成部分)

版权声明:本篇博客内容来源于本人亲身经历,属于本人原创,转载请注明出处,感谢分享~~ https://blog.csdn.net/hl_qianduan/article/details/86633149

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>自定义套餐计算</title>
    <style>
        #body{background: #F4F4F4;}li{list-style: none;width:150px;height: 90px;background: palegoldenrod;display:inline-block}
    </style>
</head>
<body>
<div id="body">
   <ul>
   </ul>
    <input type="text">
    <br>
    总money:
    <div id="num"></div>
    总money组成部分:
    <div id="name"></div>
</div>

<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
<script>
        var data={
            "data": [
                {
                    "money": "0.06",
                    "onemoney": "0.06",
                    "num": 1,
                    "name": "单个"
                },
                {
                    "money": "25",
                    "onemoney": "0.05",
                    "num": 500,
                    "name": "Q1"
                },
                {
                    "money": "80",
                    "onemoney": "0.04",
                    "num": 2000,
                    "name": "Q2"
                },
                {
                    "money": "150",
                    "onemoney": "0.03",
                    "num": 5000,
                    "name": "Q3"
                },
                {
                    "money": "200",
                    "onemoney": "0.02",
                    "num": 10000,
                    "name": "Q4"
                }
            ],
            "msg": "查询成功",
            "success": true,
            "totalCount": 5
        }
        $.each(data.data,function (i,e) {
            $("ul").append(' <li>' +
                '            <num>num='+e.num+'</num>' +
                '            <money>money='+e.money+'</money>' +
                '            <name>onemoney='+e.onemoney+'</name>' +
                '            <name>name='+e.name+'</name>' +
                '        </li>')
        })
        // 监听input输入
        var temp=new Array();
        var htmlStr="";
        var htmlSum=0;
        $('input').on('input propertychange',function(){
            var _this=$(this).val();
            console.log(_this)
            var list =data.data
            for(var i=0;i<list.length;i++){
                if(list[i].num < _this){
                    temp.push(list[i]);
                }
            }
            console.log(temp)
            for(var j=0;j<temp.length;) {
                j++;
                var a= temp.length - j;
                if(a<0){
                    return false;
                }
                if (Math.floor(_this / temp[a].num) == 0) {
                    _this=_this;
                } else {
                    htmlStr += temp[a].name+"*"+Math.floor(_this / temp[a].num)+"+";
                    htmlSum += temp[a].money*Math.floor(_this/temp[a].num);
                    _this=_this % temp[a].num;
                }
            }
            htmlStr=htmlStr.substring(0,htmlStr.length-1);
            $("#name").text("("+htmlStr+")")
            $("#num").text(htmlSum.toFixed(2))
            htmlStr="";
            htmlSum=0;
            temp=[];
        });
        


</script>
</body>
</html>

猜你喜欢

转载自blog.csdn.net/hl_qianduan/article/details/86633149