价格计算

时间：2018-04-05 06:25:41

标签： javascript html

如果没有账户将低于25，价格金额将为40，25至50之间的价格将为35，高于50的价格将为30我如何根据此类别修改我的代码

我的代码将在以下情况下显示如下：

＆＃13;
＆＃13; 
$(document).ready(function() {
  update_amounts();
  $('.qty').change(function() {
    update_amounts();
  });
});

function update_amounts() {
  var sum = 0.0;
  $('#myTable > tbody  > tr').each(function() {
    var qty = $(this).find('option:selected').val();
    var price = $(this).find('.price').val();
    var amount = (qty * price)
    sum += amount;
    $(this).find('.amount').text('' + amount);
  });
}
＆＃13; 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="myTable">
  <thead>
    <tr>
      <th>NO.OF ACCOUNTS</th>
      <th>DURATION</th>
      <th align="center"><span id="amount" class=" amount">Total</span> </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><input type="text" value="1" class="form-control price"></td>
      <td>
        <select value="" class="form-control qty" name="qty"> 
					<option value="40">1 Month(s) - Rs.40/Acc/Mo</option>
					<option value="120">3 Month(s) - Rs.40/Acc/Mo</option>
					<option value="240">6 Month(s) - Rs.40/Acc/Mo</option> 
					<option value="480">12 Month(s) - Rs.40/Acc/Mo</option>  
				</select>
      </td>
      <td align="center"><span id="amount" class="form-control amount">20</span></td><br>
    </tr>
  </tbody>
</table>
＆＃13;
＆＃13;
＆＃13;

请帮我解决问题

6 个答案:

答案 0 :(得分：2)

请查看以下解决方案

$(document).ready(function() {
  update_amounts();
  $('.qty').change(function() {
    update_amounts();
  });
});

function update_amounts() {
  var sum = 0.0;
  $('#myTable > tbody  > tr').each(function() {
    var qty = $(this).find('option:selected').val();
    var price = $(this).find('.price').val();
    var priceVariation = 40;
    if(price >= 25 && price <= 50) {
	    priceVariation = 35;
    }
    else if(price > 50) {
	   priceVariation = 30;
    }
    var amount = (qty * price * priceVariation);
    sum += amount;
    $(this).find('.amount').text('' + amount);
  });
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="myTable">
  <thead>
    <tr>
      <th>NO.OF ACCOUNTS</th>
      <th>DURATION</th>
      <th align="center"><span id="amount" class=" amount">Total</span> </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><input type="text" value="1" class="form-control price"></td>
      <td>
        <select value="" class="form-control qty" name="qty"> 
					<option value="1">1 Month(s) - Rs.40/Acc/Mo</option>
					<option value="3">3 Month(s) - Rs.40/Acc/Mo</option>
					<option value="6">6 Month(s) - Rs.40/Acc/Mo</option> 
					<option value="12">12 Month(s) - Rs.40/Acc/Mo</option>  
				</select>
      </td>
      <td align="center"><span id="amount" class="form-control amount">20</span></td><br>
    </tr>
  </tbody>
</table>

答案 1 :(得分：1)

我已对您的代码进行了一些更新。 将脚本更新为：

 $(document).ready(function() {
  update_amounts();
  $('#qty').change(function() {
    update_amounts();
  });
  $('#acc_count').change(function() {
    update_qty();
  });
});

function update_amounts() {
  var sum = 0.0;
  $('#myTable > tbody  > tr').each(function() {
    var qty = $(this).find('option:selected').val();
    var price = $(this).find('.price').val();
    var amount = (qty * price)
    sum += amount;
    $(this).find('.amount').text('' + amount);
  });
}

function update_qty() {
  var acc_count = $('#acc_count').val();
  $("#qty").children('option').remove();
  var per_price;
  if (acc_count < 25)
    per_price = 40;
  else if (acc_count < 50)
    per_price = 35;
  else
    per_price = 30;

  for (var i = 0; i < 4; i++) {
    var opText = (i + 1) + ' Month(s) - Rs.' + per_price + '/Acc/Mo'
    var value = per_price * (i + 1);
    $('#qty')
      .append($("<option></option>")
        .attr("value", value)
        .text(opText));
  }
  update_amounts();
}

和您的HTML为：

<table id="myTable">
  <thead>
    <tr>
      <th>NO.OF ACCOUNTS</th>
      <th>DURATION</th>
      <th align="center"><span id="amount" class=" amount">Total</span> </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><input type="text" value="1" class="form-control price" id="acc_count"></td>
      <td>
        <select value="" class="form-control " id="qty">
                <option value="40">1 Month(s) - Rs.40/Acc/Mo</option>
                <option value="120">3 Month(s) - Rs.40/Acc/Mo</option>
                <option value="240">6 Month(s) - Rs.40/Acc/Mo</option> 
                <option value="480">12 Month(s) - Rs.40/Acc/Mo</option>  
            </select>
      </td>
      <td align="center"><span id="amount" class="form-control amount">20</span></td><br>
    </tr>
  </tbody>

这将根据您的需要自动更新选择框，并根据编号计算总价。已输入帐户

答案 2 :(得分：0)

var amount = (qty * getPrice(qty));

function getPrice(quantity) {
  let price = 0;
  if (quantity <= 25) {
    price = 40;
  } else if (quantity > 25 && quantity <= 50) {
    price = 35;
  } else {
    price = 30;
  }
  return price;
}

答案 3 :(得分：0)

按帐户数上限限制

创建价格地图。

var priceMap = {
   25: 40,
   50: 35,
   "def": 30 //if no other upper bound limit applies
}

创建一个方法，在传递帐户数后返回价格

var fnGetPrice = (acc) => { 
  var key = Object.keys( priceMap )
             .sort( (a, b) => a-b )
             .find( s => !isNaN( s ) || +s > acc )  //get first value greater than acc
         || "def"; //or pass the default value
  return priceMap[key];
};

现在在计算值

时使用此priceMap 
var price = $(this).find('.price').html();
var value = ( qty * fnGetPrice( price ) );

答案 4 :(得分：0)

试试这个：

$(document).ready(function() {
  update_amounts();
  $('.qty').change(function() {
    update_amounts();
  });
});

function update_amounts() {
  var sum = 0.0;
  $('#myTable > tbody  > tr').each(function() {
    var qty = $(this).find('option:selected').val();
    var price = $(this).find('.price').val();
    if (price >= 50) {
        qty = qty * .75
    }
    else if (price >= 25) {
        qty = qty * .875
    }
    var amount = (qty * price)
    sum += amount;
    $(this).find('.amount').text('' + amount);
  });
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="myTable">
  <thead>
    <tr>
      <th>NO.OF ACCOUNTS</th>
      <th>DURATION</th>
      <th align="center"><span id="amount" class=" amount">Total</span> </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><input type="text" value="1" class="form-control price"></td>
      <td>
        <select value="" class="form-control qty" name="qty"> 
					<option value="40">1 Month(s) - Rs.40/Acc/Mo</option>
					<option value="120">3 Month(s) - Rs.40/Acc/Mo</option>
					<option value="240">6 Month(s) - Rs.40/Acc/Mo</option> 
					<option value="480">12 Month(s) - Rs.40/Acc/Mo</option>  
				</select>
      </td>
      <td align="center"><span id="amount" class="form-control amount">20</span></td><br>
    </tr>
  </tbody>
</table>

答案 5 :(得分：0)

我必须根据输入/选择的责任更改几个类，id。 Besdie我在选项中添加了另一个属性。看看这个解决方案是否足以满足您的需求。

＆＃13;
＆＃13; 
$(document).ready(function() {
	$unitPrice = 40;
	$qty = 1;
        update_amounts($unitPrice);
      $('.price').change(function() {
	
        update_amounts($unitPrice);
      });
      $('.qty').on('blur',function(){
	$qty = $(this).val();
	$unitPrice = 40;
	if($qty >= 25 && $qty <= 50){
		$unitPrice = 35;
	}else if($qty > 50){
		$unitPrice = 30;
	}
	update_amounts($unitPrice);
      });
	function update_amounts($unitPrice) {
      var sum = 0.0;
	$('#price > option').each(function(){
		$duration = parseInt($(this).attr('duration'));
		$(this).val($unitPrice * $duration);
		$(this).text($duration + "Month(s) - Rs." + $unitPrice * $duration + "/Acc/Mo");
	});
        var qty = $("#qty").val();
        var price = $("#price").val();
        var amount = (qty * price)
        sum += amount;
        $("#total").text('' + amount);
    	}
    });
＆＃13; 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="myTable">
      <thead>
        <tr>
          <th>NO.OF ACCOUNTS</th>
          <th>DURATION</th>
          <th align="center"><span id="amount" class="amount">Total</span> </th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td><input type="text" id="qty" value="1" class="form-control qty"></td>
          <td>
            <select value="" class="form-control price" name="price" id="price"> 
    					<option value="40" duration="1">1 Month(s) - Rs.40/Acc/Mo</option>
    					<option value="120" duration="3">3 Month(s) - Rs.40/Acc/Mo</option>
    					<option value="240" duration="6">6 Month(s) - Rs.40/Acc/Mo</option> 
    					<option value="480" duration="12">12 Month(s) - Rs.40/Acc/Mo</option>  
    				</select>
          </td>
          <td align="center"><span id="total" class="form-control amount">20</span></td><br>
        </tr>
      </tbody>
    </table>
＆＃13;
＆＃13;
＆＃13;

相关问题
最新问题