Question

我正在做一个比萨饼Web应用程序，用户可以在其中在线订购食物，我想用他们选择的比萨饼的具体尺寸来计算总价。我正在尝试使用一个开关盒，根据尺寸将其等同于特定数量。

我尝试使用开关盒，但没有达到我想要的

 function Pizza(size,topping,crust, name){
  this.size = size;
  this.topping = topping;
  this.crust = crust;
  this.name = name;
}

$(document).ready(function(){
  $("form#myform").submit(function(event){
    event.preventDefault();
    var sizep = $("#sizes option:selected").val();
    var topp = $("#toppings option:selected").val();
    var crustp = $("#crusts option:selected").val();
    var pname = $("#flavour option:selected").val();

    var small = $("#smal :selected").val();
    var medium = $("#medium :selected").val();
    var large = $("#large :selected").val();

    switch (sizep) {
      case small:
        price = 450;
        break;
      case medium:
        price = 750;
        break;
      case large:
        price = 1500;
        break;
      default:sizep

    }
    $("#total").append("Total:" + sizep.price);
  });
});

   <div class="flavour">
      <h6>Size</h6>
      <select class="input-group" id="sizes" name="Quantity">
         <option value="small">
           Small<span class="price">450</span> 
         </option>
         <option value="medium">
            Medium <span class="price">Ksh.750</span>
         </option>
         <option value="large">
           Large <span class="price">Ksh.1500</span>
         </option>
      </select>
   </div>

Answer 1

我认为这是代码中的一些问题。

获取选择选项值的选择器不正确
我不知道var sizep.price来自哪里...
我不认为有必要获取选项值以在开关中对其进行检查，因为您必须从头开始编写它们才能在vars中获取选项值。这样，可以直接在交换机中检查它们。

根据您的html，我会做类似的事情。

$(document).ready(function(){
  $("form#myform").submit(function(event){
    event.preventDefault();
    var sizep = $("#sizes option:selected").val();
    var topp = $("#toppings option:selected").val();
    var crustp = $("#crusts option:selected").val();
    var pname = $("#flavour option:selected").val();

    var price = 0; 

    // not necessary but you can see how to select options val
    //var small = $('#sizes > select > option[value="small"]').val();
    //var medium = $('#sizes > select > option[value="medium"]').val();
    //var large = $('#sizes > select > option[value="large"]').val();

    switch (sizep) {
      case "small":
        price = 450;
        break;
      case "medium":
        price = 750;
        break;
      case "large":
        price = 1500;
        break;
      default:sizep

    }
    $("#total").append("Total:" + price);
  });
});

但实际上，要想进一步了解这种情况，我会创建一个服务，该服务具有将比萨饼价格或某个属性放入比萨饼类中的功能，以便根据大小计算价格。

致谢

在结帐前计算购物车的总价

1 个答案: