• 如何做当当网购物结账页面?


    商品金额总计:document.getElementById("product_total").innerHTML=Math.round(total*100)/100;  //保留小数点后两位

    您共节省金额:¥

    document.getElementById("product_save").innerHTML=Math.round(save*100)/100; //保留小数点后两位


    可获商品积分:

    document.getElementById("product_integral").innerHTML=integral;

    js写两个方法

    /*自动计算商品的总金额、总共节省的金额和积分*/
    function productCount(){
    var total=0; //商品金额总计
    var save=0; //您共节省的金额
    var integral=0; //可获商品积分

    var point; //每一行商品的单品积分
    var price; //每一行商品的市场价格
    var ddPrice; //每一行商品的当当价格
    var number; //每一行商品的数量

    /*访问ID为myTableProduct表格中所有的行数*/
    var myTableTr=document.getElementById("myTableProduct").getElementsByTagName("tr");
    for(var i=0;i<myTableTr.length;i++){
    point=myTableTr[i].getElementsByTagName("td")[1].getElementsByTagName("label")[0].innerHTML;
    price=myTableTr[i].getElementsByTagName("td")[2].getElementsByTagName("label")[0].innerHTML;
    ddPrice=myTableTr[i].getElementsByTagName("td")[3].getElementsByTagName("label")[0].innerHTML;
    number=myTableTr[i].getElementsByTagName("td")[4].getElementsByTagName("input")[0].value;
    integral+=point*number;
    total+=ddPrice*number;
    save+=(price-ddPrice)*number;
    }
    document.getElementById("product_total").innerHTML=Math.round(total*100)/100; //保留小数点后两位
    document.getElementById("product_save").innerHTML=Math.round(save*100)/100; //保留小数点后两位
    document.getElementById("product_integral").innerHTML=integral;

    }
    window.onload=productCount;

    删除的方法 tr有id属性  删除所在td没有id属性 方法调用删除所在列的父级行的id进行删除行:方法如下:

    function deleteProduct(elementId){
    var delElement=document.getElementById(elementId); //删除元素的id
    var flag=confirm("你确定要删除此商品吗?");
    if(flag==true){
    delElement.parentNode.removeChild(delElement);
    productCount();
    }
    }

  • 相关阅读:
    react方法传参的两种方式
    react引入本地图片和远程图片
    用yarn代替npm
    react生命周期
    react子传父
    react删除元素
    react遍历数组
    react监听input框里的值
    react创建组件的两种方式
    vue打包更改dist文件夹名称
  • 原文地址:https://www.cnblogs.com/tian114527375/p/4902915.html
Copyright © 2020-2023  润新知