在我的代码中，我需要将选中的特定复选框的值添加到span元素中。问题是它的第一次点击复选框，计算出错了。
如您所见，如果您第一次单击某个复选框，它将减去值而不是添加值。是不是有什么我忘了补充？下面列出了我的代码。先谢谢你了

const s = document.querySelectorAll('#enroll-subject');
        const cue = document.getElementById('cu');
        let cu = parseInt(cue.textContent.replace('Current Units: ', '').trim());
        s.forEach(cb => {
          cb.addEventListener('change', updateTotalUnits);
        });
        function updateTotalUnits() {
          let totalUnits = cu;
          s.forEach(cb => {
            if (cb.checked) {
              console.log("checked");
              totalUnits += parseInt(cb.value);
            } else {
              console.log("not checked");
              totalUnits -= parseInt(cb.value);
            }
          });
          cue.innerHTML = `Current Units: ${totalUnits}`;
        }

<div class="irreg-container" style="display:flex; flex-direction:column; text-align: center;">
      <div class="header" style="display:flex; flex-direction:column;">
        <span style="padding: 1em;" id="cu">Current Units: 15</span>
        <span style="padding: .7em;font-size:1.3em;">Checkboxes</span>
      </div>
      <div class="subjects" style="display:flex; flex-direction: column;">

      <table>
        <tbody>
          <tr>
            <td style="width: 100%;">Checkbox 1</td>
            <td style="width: 100%;"><input class="sbj-checkbox" type="checkbox" name="enroll-subject" value="4" id="enroll-subject">
            </td>
          </tr>
          <tr>
            <td style="width: 100%;">Checkbox 2</td>
            <td style="width: 100%;"><input class="sbj-checkbox" type="checkbox" name="enroll-subject" value="4" id="enroll-subject">
            </td>
         </tr>
         <tr>
           <td style="width: 100%;">Checkbox 3</td>
           <td style="width: 100%;"><input class="sbj-checkbox" type="checkbox" name="enroll-subject" value="4" id="enroll-subject">
           </td>
         </tr>
         <tr>
           <td style="width: 100%;">Checkbox 4</td>
           <td style="width: 100%;"><input class="sbj-checkbox" type="checkbox" name="enroll-subject" value="4" id="enroll-subject">
         </td>
         </tr>
       </tbody>
     </table>
     <div class="button-container" style="text-align: center;">
       <button class="submit"> Submit </button>
     </div>
   </div>
 </div>