Jquery复选框被选中？答案

【问题标题】：Jquery Checkbox is checked?Jquery复选框被选中？
【发布时间】：2018-03-11 17:36:25
【问题描述】：

我正在使用 jQuery 和一个小的 rangeslider.js 制作一个具有不同价格的滑块。我使一切正常，但是后两个数字仅在我移动滑块时发生变化，而不是在我选中复选框时发生变化。当我单击复选框时，我正在尝试正确更改数字。

$(document).on('input change', '#range-slider', '#voiceover', function() { //Listen to slider changes (input changes)       

    var v=$(this).val();
  var voiceOption = $('#voiceover');//Create a Variable (v), and store the value of the input change (Ex. Image 2 [imageURL])
  console.log(v);

$('#sliderStatus').html(videoDuration[v]);
$('#sliderPrice').html('<span>$'+videoSubtotal[v]+'.00</span>');

var totalPrice = parseInt(voiceoverSubtotal[v])+parseInt(videoSubtotal[v]);
  if(voiceOption.is(":checked")){
    $('#voiceoverspan').html('<span>$'+voiceoverSubtotal[v]+'.00</span>');
      $('#totalspan').html('<span>$'+totalPrice+'.00</span>');
  }
    else{
    $('#voiceoverspan').html('<span>$0.00</span>');
     $('#totalspan').html('<span>$'+videoSubtotal[v]+'.00</span>');
  }

  /*if(voiceOption.is(":checked") ){
    $('#totalspan').html('<span>$'+totalPrice+'.00</span>');
  }
  else{
    $('#totalspan').html('<span>$'+videoSubtotal[v]+'.00</span>');
  }*/
});

非常感谢，我的 codepen 在这里：https://codepen.io/2cheeky4you/pen/QqGKpy

【问题讨论】：

标签： javascript jquery arrays checkbox slider

【解决方案1】：

更新的 CodePen： https://codepen.io/bhansa/pen/aLwGZo

您应该在复选框中添加一个更改事件并更新 if 语句中的 html 数据。将您的复选框更改方法保留在 input#range-slider 更改方法之外。

v = $("input#range-slider").val();

 voiceOption.on("change", function(){
    if(voiceOption.is(":checked")){
    $('#voiceoverspan').html('<span>$'+voiceoverSubtotal[v]+'.00</span>');
      $('#totalspan').html('<span>$'+totalPrice+'.00</span>');
  }
    else{
    $('#voiceoverspan').html('<span>$0.00</span>');
     $('#totalspan').html('<span>$'+videoSubtotal[v]+'.00</span>');
  }
  });

【讨论】：

这适用于复选框，但不会随滑块改变。
如果您也想使用滑块更改画外音价格，请在滑块值更改方法中添加代码。你不能把这两个事件放在一起，这是我的观点。
哦！！这更有意义！非常感谢！

【解决方案2】：

您需要对复选框上的更改事件做出反应：

$("#voiceover").on("change", doUpdate);

【讨论】：

【解决方案3】：

问题是您的所有代码都包含在滑块的更改事件中。

$(document).on('input change', '#range-slider', '#voiceover', function() { //Listen to slider changes (input changes)

这意味着仅当滑块也更改时才会检查复选框更改。移动这条线

});

高于您的注释代码。然后像这样格式化底部的注释代码。

$('#checkBoxId').on('click', function() {
     if(this.checked) {
         if(voiceOption.is(":checked") ){
             $('#totalspan').html('<span>$'+totalPrice+'.00</span>');
         }
         else {
             $('#totalspan').html('<span>$'+videoSubtotal[v]+'.00</span>');
         }
     }
});

【讨论】：

我试了一下，它说：Unexpected Token, ILLEGAL。我会怎么想