如何使用jquery获取最后点击的无线电值?

时间:2017-12-26 07:52:19

标签: javascript jquery

我试图将价格加总或减去总价格,如下面的工作脚本所示。以下脚本工作正常,但我想减去以前点击的总价格的无线电价格。

假如我点击Wrap哪个价格为3,那么总价格变为8.但是当我点击任何其他单选按钮时,Wrap价格应该从总数减去。对于那项任务,我尝试了很多并寻找解决方案。有没有办法存储以前点击的价格?如果有人指导我,我要感谢。

$('.SECOND_POP_PRICE').on('click', function() {

  if ($(this).is(':checked')) {
    var PRICE_Product_ID = $(this).parent().attr('data-product_id');
    var SECOND_SECTION_PRICE = parseFloat($(this).parent().attr('data-second_section_price'));
    var SECOND_SECTION_POP_PRICE = parseFloat($('#pop_price_' + PRICE_Product_ID).text());
    if (SECOND_SECTION_PRICE != 0) {
      var SECOND_SECTION_UPDATED_PRICE = +SECOND_SECTION_PRICE + +SECOND_SECTION_POP_PRICE;
      $('#pop_price_' + PRICE_Product_ID).text(SECOND_SECTION_UPDATED_PRICE);
    }
  } // if checkbox is checked
  /* if($(this).prop('checked')==false){  */
  else {
    var PRICE_Product_ID = $(this).parent().attr('data-product_id');
    var SECOND_SECTION_PRICE = parseFloat($(this).parent().attr('data-second_section_price'));
    var SECOND_SECTION_POP_PRICE = parseFloat($('#pop_price_' + PRICE_Product_ID).text());
    if (SECOND_SECTION_PRICE != 0) {
      var SECOND_SECTION_UPDATED_PRICE = parseFloat(SECOND_SECTION_POP_PRICE - SECOND_SECTION_PRICE);
      $('#pop_price_' + PRICE_Product_ID).text(SECOND_SECTION_UPDATED_PRICE);
    }
  } // if checkbox is un-checked
}); /* END PRICE OF SECOND SECTION 1 */
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<small class="pop_price"><span id="pop_price_2">5</span> AED</small>
<br />
<label data-product_id="2" data-second_section_price="3.00">
<input type="radio" class=" toggle_section_3 SECOND_POP_PRICE" name="section_two" value="Wrap">
Wrap (3.00 AED)</label>
<label data-product_id="2" data-second_section_price="4.00">
<input type="radio" class=" toggle_section_3 SECOND_POP_PRICE" name="section_two" value="Roll">
Roll (4.00 AED)</label>
<label data-product_id="2" data-second_section_price="5.00">
<input type="radio" class="hide_section_3 toggle_section_3 SECOND_POP_PRICE" name="section_two" value="Open">
Open (5.00 AED)</label>

2 个答案:

答案 0 :(得分:1)

不要将单击的单选按钮添加到总计。将其添加到基本价格中,该价格存储在您显示总数的范围的文本之外的其他位置。在我的代码中,我将其放在范围的data-price属性中。

也不需要if,因为您无法取消选中单选按钮。

$('.SECOND_POP_PRICE').on('click', function() {

  var PRICE_Product_ID = $(this).parent().attr('data-product_id');
  var SECOND_SECTION_PRICE = parseFloat($(this).parent().attr('data-second_section_price'));
  var SECOND_SECTION_POP_PRICE = parseFloat($('#pop_price_' + PRICE_Product_ID).data("price"));
  if (SECOND_SECTION_PRICE != 0) {
    var SECOND_SECTION_UPDATED_PRICE = +SECOND_SECTION_PRICE + +SECOND_SECTION_POP_PRICE;
    $('#pop_price_' + PRICE_Product_ID).text(SECOND_SECTION_UPDATED_PRICE);
  }
}); /* END PRICE OF SECOND SECTION 1 */
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<small class="pop_price"><span id="pop_price_2" data-price="5.00">5</span> AED</small>
<br />
<label data-product_id="2" data-second_section_price="3.00">
<input type="radio" class=" toggle_section_3 SECOND_POP_PRICE" name="section_two" value="Wrap">
Wrap (3.00 AED)</label>
<label data-product_id="2" data-second_section_price="4.00">
<input type="radio" class=" toggle_section_3 SECOND_POP_PRICE" name="section_two" value="Roll">
Roll (4.00 AED)</label>
<label data-product_id="2" data-second_section_price="5.00">
<input type="radio" class="hide_section_3 toggle_section_3 SECOND_POP_PRICE" name="section_two" value="Open">
Open (5.00 AED)</label>

答案 1 :(得分:0)

// here that refers to the context which is you can use to store the last value, you need to find out that context
$('.SECOND_POP_PRICE').on('change',function(event,that){
		var updatedValue = that.lastValue - this.value;
		$('#pop_price_'+PRICE_Product_ID).text(updatedValue);
		that.lastValue = updatedValue
	})