jQuery 带条件价格计算

问题描述 投票:0回答:1

我对编程完全陌生,所以我提前道歉。

我正在尝试在网站上创建联系表格,其中还将包括价格计算。价格将取决于所选国家和用户选择的“课程”数量。

示例:如果用户选择欧盟,同时选择1类,价格为1100欧元,如果选择2类,价格为1150欧元,如果选择3类,价格为1150欧元1400,如果他选择4个或更多课程,每堂课价格将+200欧元。

我尝试使用jQuery来获取所选类的数量(我成功了),然后通过“if”条件设置价格。问题是“setPrice”函数没有通过“countSelectedItems”函数响应类数量的变化。但是,如果我手动更改类的数量,“setPrice”函数就可以工作。

请告诉我哪里做错了?

$("#form-field-classes").change(function() {
  countSelectedItems();
}).change();

function countSelectedItems() {
  var count = $("#form-field-classes :selected").length;
  //console.log(count);
 parseInt($("#form-field-count").val(count));}
 
$("#form-field-count").change(function() {setPrice();
}).change();

function setPrice()
{
    if($("#form-field-count").val() === 1){
        $("#result").text("1100");
    }}
<select name="form_fields[classes][]" id="form-field-classes" type="select" multiple="" data-options='["Class 1","Class 2","Class 3","Class 4","Class 5","Class 6"]'  placeholder = Choose... >
<option value="Class 1">Class 1</option>
<option value="Class 2">Class 2</option>
<option value="Class 3">Class 3</option>
<option value="Class 4">Class 4</option>
<option value="Class 5">Class 5</option>
<option value="Class 6">Class 6</option>
        
<input type="number" name="form_fields[count]" id="form-field-count">

<br /> Total: &euro; <span id="result"></span>
jquery calculation
1个回答
0
投票

希望下面的代码可以工作。

HTML:

<select name="form_fields[classes][]" id="form-field-classes" type="select" multiple="" data-options='["Class 1","Class 2","Class 3","Class 4","Class 5","Class 6"]'  placeholder = Choose... >
<option value="1">Class 1</option>
<option value="2">Class 2</option>
<option value="3">Class 3</option>
<option value="4">Class 4</option>
<option value="5">Class 5</option>
<option value="6">Class 6</option>
 <option value="7">Class 6</option>       
<input type="number" name="form_fields[count]" id="form-field-count">

<br /> Total: &euro; <span id="result">0</span>

JQuery:

$("#form-field-classes").change(function() {
  countSelectedItems();
}).change();

function countSelectedItems() {
  var count = $("#form-field-classes :selected").val();
    parseInt($("#form-field-count").val(count));
    setPrice();

}


function setPrice()
{
   if($("#form-field-count").val() === "1"){
        $("#result").text("1100");
    }
    else if($("#form-field-count").val() === "2"){
            $("#result").text("1150");
        }
    else if($("#form-field-count").val() === "3"){
            $("#result").text("1400");
        }
    
    else {
          let result;
          let selectedPrice = $("#form-field-count").val();
          resultedPRice = ( selectedPrice * 100  ) + ((selectedPrice * 100  ) -200 ) + 1000;
          $("#result").text(resultedPRice);
        }
}
© www.soinside.com 2019 - 2024. All rights reserved.