购物时添加数量

Posted Wyc

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了购物时添加数量相关的知识，希望对你有一定的参考价值。

 

购物数量添加：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            body{
                margin: 0;
            }
            .left{
                float: left;
            }
            .wrap{
                width: 150px;
                height: 22px;
                border: 1px solid #ddd;
                /*background-color: red;*/
                position: relative;
                left: 100px;
                top: 100px;
            }
            .wrap .minus{
                height: 22px;
                width: 22px;
                line-height: 22px;
                text-align: center;
                cursor: pointer;
            }
            .wrap .plus{
                height: 22px;
                width: 22px;
                line-height: 22px;
                text-align: center;
                cursor: pointer; /*当鼠标指的时候变样式*/
            }
            .wrap .count input{
                padding: 0;  /*input是有padding的*/
                border: 0;
                width: 104px;
                height: 22px;
                border-left: 1px solid #dddddd;
                border-right: 1px solid #dddddd;
            }
        </style>
    </head>
    <body>
        <div class="wrap">
            <div class="minus left" onclick=\'Minus();\'>-</div>
            <div class="count left">
                <input id=\'count\' type="text"  />
            </div>
            <div class="plus left" onclick=\'Plus();\'>+</div>
        </div>
        <script type="text/javascript">
            function Plus(){
                var old_str = document.getElementById(\'count\').value
                var old_int = parseInt(old_str);
                var new_int = old_int + 1
                document.getElementById(\'count\').value = new_int
            }
            function Minus(){
                var old_str = document.getElementById(\'count\').value
                var old_int = parseInt(old_str);
                var new_int = old_int - 1
                document.getElementById(\'count\').value = new_int
            }

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


cursor:pointer;  /*鼠标尖头变小手*/
View Code

 

以上是关于购物时添加数量的主要内容，如果未能解决你的问题，请参考以下文章

Springboot商城购物车防刷新时自动添加数量

"首页添加至购物车,TabBar显示购物车的数量"实现

使用复选框将数量添加到购物车

Shopify购买按钮最小数量

使用 TextField Flutter 选择购物车数量

Woocommerce 中的迷你购物车数量变化