创建购物车网站,子价格问题

时间:2017-04-10 17:19:39

标签: javascript php html

shopping cart image

我想创建在colomn上显示的subprice函数,但我不知道如何从第一个id以下的数量打印subprice,请帮帮我:D 此代码用于显示子价格

<div class="col-sm-2 text-center" id="test">
  <script>
    $("input[name=quantity0]").on("keydown",function(){
    id= "<?php echo $id ;?>";
    var price;
    quantity=$("input[name=quantity0]").val();
    for(i=0;i<carts.length;i++){
    if(id==1){
      price=30;
      total=price*quantity;
      $("#test").text("$"+total);
    }
    if(id==2){
      price=30;
      total=price*quantity;
      $("#test").text("$"+total);
    }
    if(id==3){
      price=30;
      total=price*quantity;
      $("#test").text("$"+total);
    }
    if(id==4){
      price=30;
      total=price*quantity;
      $("#test").text("$"+total);
    }
    if(id==5){
      price=30;
      total=price*quantity;
      $("#test").text("$"+total);
    }
    if(id==6){
      price=30;
      total=price*quantity;
      $("#test").text("$"+total);
    }
    if(id==7){
      price=30;
      total=price*quantity;
      $("#test").text("$"+total);
    }
    if(id==8){
      price=30;
      total=price*quantity;
      $("#test").text("$"+total);
    }
    if(id==9){
      price=30;
      total=price*quantity;
      $("#test").text("$"+total);
    }
    if(id==10){
      price=30;
      total=price*quantity;
      $("#test").text("$"+total);
    }
  }
  });
  </script>
</div>

我将其上传到我的网站http://scellion.hol.es/,以防你们需要尝试解决问题:D

1 个答案:

答案 0 :(得分:0)

在我看来,您应该首先重新设计您的代码,此时我们很难准确回答您的问题。我不知道你的经验水平,但我会给你一些提示。

SWITCH CASE

而不是:

if(id==1){
  price=30;
  total=price*quantity;
  $("#test").text("$"+total);
}
if(id==2){
  price=30;
  total=price*quantity;
  $("#test").text("$"+total);
}
if(id==3){
  price=30;
  total=price*quantity;
  $("#test").text("$"+total);
}
if(id==4){
  price=30;
  total=price*quantity;
  $("#test").text("$"+total);
}

你应该用这个:

switch(id):{
    case 1:{
         price=30;
         total=price*quantity;
         $("#test").text("$"+total);
         break;
    }

    case 2:{
         price=30;
         total=price*quantity;
         $("#test").text("$"+total);
         break;
    }

    case 3:{
         price=30;
         total=price*quantity;
         $("#test").text("$"+total);
         break;
    }


    case 4:{
         price=30;
         total=price*quantity;
         $("#test").text("$"+total);
         break;
    }

    default:{

    }
}

创建功能

您应该创建一个函数,而不是复制和粘贴相同的代码。功能对软件维护也很有用。示例:

function setText(){

         price=30;
         total=price*quantity;
         $("#test").text("$"+total);
}

switch(id):{
    case 1:{
         setText();
         break;
    }

    case 2:{
         setText();
         break;
    }

    case 3:{
         setText();
         break;
    }


    case 4:{
         setText();
         break;
    }

    default:{

    }
}

无论如何,如果我理解了这个问题,这是我在您的网站上在浏览器控制台中测试的代码,它似乎有效:

//THIS IS FOR INTERCEPT VALUE CHANGE (UP AND DOWN)
$("input[name=quantity0]").bind('keyup mouseup', function () {

    //JUST FOR TESTING, BUT YOU NEED TO TAKE THE REAL PRICE OF THE ITEM
    var priceSingleUnit = 30;

    //THIS.VALUE ---> TAKES THE VALUE OF THE INPUT FIELD
    if(!(this.value <= 0)){
    $("#test").text("$" + (this.value * priceSingleUnit));
    }

});

有用的链接:

https://www.w3schools.com/js/js_switch.asp

https://www.w3schools.com/js/js_functions.asp