JS在页面根据数量改变总价及按钮进行格式验证

Posted 御行所

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JS在页面根据数量改变总价及按钮进行格式验证相关的知识,希望对你有一定的参考价值。

分两部分,第一部分是在页面上,根据数量的input标签内容,动态更新总价标签的内容,代码如下:

<script type="text/javascript">
    $(document).ready(function () {
        $("#iquantity").bind(‘input propertychange‘, function () {
            var quantity = $("#iquantity").val();
            var price = 49;
            var total = price * quantity;
            $("#atotal").text(total);
            });
        });
</script>

另一部分是按钮的验证,代码如下:

 1 <script type="text/javascript">
 2     $(document).ready(function () {
 3         $("#btSave").click(function () {
 4             if ($("#iquantity").val() == "") {
 5                 alert("请填写购买数量
Please fill in the Quantity");
 6                 return false;
 7             }
 8             var zz = /^[1-9]d*$/;
 9             var qq = $("#iquantity").val();
10             if (!zz.test(qq)) {
11                 alert("请正确填写购买数量,格式为非零的正整数
Please fill in the correct format for the Quantity.A positive integer in the form of nonzero.");
12                 return false;
13             }
14             $("#btSave").hide();
15             var words = "请稍后...";
16             $("#F").html(words);//F为一个span标签
17             return true;
18         });
19     });
20 </script>    

 

以上是关于JS在页面根据数量改变总价及按钮进行格式验证的主要内容,如果未能解决你的问题,请参考以下文章

angularjs购物车练习

GO语言开发天天生鲜项目第五天 购物车模块和订单模块

在 WooCommerce 单品页面显示总价,商品原价 *​​ 最小数量

微信小程序——购物车结算

SSH网上商城项目实战28使用Ajax技术局部更新商品数量和总价

点击添加或减少数量,总价随之改变(keyup的用法)