如何使输出对功能作出反应?

时间:2018-12-20 13:15:48

标签: jquery html

我有一个总价值输出。当取消选中复选框时,我需要减少它。它可以正常工作,但不能用于取消选中此框的功能。

Jquery总值输出:

$(document).ready(function() {
  var begin = 720;
  $("#yett").val('Total €' + begin.toFixed(2).replace(/\./g, ','));
  $("#CalculatorPlacing").on("change", function() {
    var prev = $("#yett").val().split('€')[1];
    if ($(this).prop('checked') == true) {
      total = begin - 300;
      $("#yett").val('Total €' + total.toFixed(2).replace(/\./g, ','));
    }else{
      $("#yett").val('Total €' + begin.toFixed(2).replace(/\./g, ','));
    }
  });
});

jQuery取消选中该框:

$('#CalculatorTransport').change(function() {
  if ($('#CalculatorTransport').is(':checked') == true) { // off
    $("#CalculatorPlacing").attr("disabled", true);
    $('#CalculatorPlacing').prop('checked', true);
  }
});

值输出:

<div class="SummaryRow">
  <h1><input type="yeets" name="_mdjm_event_cost" id="yett" class="mdjm-input-currency required" readonly="readonly" value="" placeholder="Totaal €0.00" style="
        height: 100px;
        width: 275px;
        margin-top: -40px;
        color: black;
        font-weight: bold;" />
  </h1>
</div>

两个复选框:

<div class="switch" onclick="TotaalOfferte()">
   <input type="checkbox" name="iCalculatorTransport" id="CalculatorTransport" class="cmn-toggle cmn-toggle-round AutosubmitCalculator" value="0" tabindex="4">
   <label for="CalculatorTransport" data-on="JA" data-off="NEE"></label>
</div>


<div class="switch">
  <input type="checkbox" name="iCalculatorPlacing" id="CalculatorPlacing" class="cmn-toggle cmn-toggle-round AutosubmitCalculator" value="1" tabindex="5">
  <label for="CalculatorPlacing" data-on="JA" data-off="NEE"></label>
</div>

当我取消选中“ CalculatorTransport”复选框时,也会取消选中“ CalculatorPlacing”复选框,但是我的总价值函数对此没有反应。有人知道为什么会这样吗?

2 个答案:

答案 0 :(得分:1)

如果我理解正确的问题,则可以执行类似的操作。有关更多详细信息,请参见摘要中的评论

(Get-CimInstance Win32_ComputerSystem).NumberOfLogicalProcessors
$(document).ready(function() {
  var total = $('#yett').text();  
  $(".switch").on('change', function(event){
  
      // remove $  
      total = total.substring(0, total.length-1);   
      
      //check if clicked checkbox is checked
      if($(this).is(":checked")){       
       //subtract clicked input by the "subtractby" value (from the HTML)
        total = ~~total - ~~($(this).attr('subtractby'));   
      }
      else{      
      //add to the clicked input by the "subtractby" value (from the HTML)         
        total = ~~total + ~~($(this).attr('subtractby'));   
      }                 
      
      //add back the $
      total = total + "$"; 
      
      //update the text
      $('#yett').text(total);      
  });
});

答案 1 :(得分:0)

MDN doc on change

  

document.add_heading('xxx', level=Y)事件不同,不一定会为元素值的每次更改触发input事件。

相反,建议用户使用MutationObserver。因此,您的代码可以按以下方式重写:

change