javascript - 根据范围内的价格选中复选框

Question

所以我有一个捐赠表格，人们可以选择不同的捐赠金额，所以我想在捐赠金额大于或等于 20 时自动选中一个复选框。

这是 html(数据总数保持不变，文本是变化的元素)

<span class="give-final-total-amount" data-total="20.00">$455.00</span>
<input type="checkbox" value="2" name="group[12581][2]" id="mce-group[12581]-12581-1">

这就是我正在尝试使用 jQuery

$( document ).ready(function() {
if ($(".give-final-total-amount").text() >= 20.00)  {
jQuery("#mce-group[12581]-12581-1").prop("checked", true);
}
else {
    $("#mce-group[12581]-12581-1").prop("checked", false);
}
});

Answer 1

美元符号使您无法进行比较。请参阅下面的其他评论:

$(function() {
  // Get a reference to the checkbox
  var chk = document.getElementById("mce-group[12581]-12581-1");
  
  // You can't compare the value of the span against a number if the value is not-numeric
  // you have to remove the dollar sign first
  if ($(".give-final-total-amount").text().replace("$", "") >= 20)  {
    // No need for JQuery on this, just set the checked property to true
    chk.checked = true;
  } else {
    // Set checked property to false
    chk.checked = false;
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class="give-final-total-amount" data-total="20.00">$455.00</span>
<input type="checkbox" value="2" name="group[12581][2]" id="mce-group[12581]-12581-1">