Переменная не переназначается на проверенное значение

Question

Значение переменной garageVal не обновляется при выборе флажка.

Поскольку положение флажка по умолчанию проверяется при первом выборе, garageVal равно 15000, но оно не изменяется при выборе другого значения.

Цель этого раздела - подсчитать оценку дома.garageVal подключается к калькулятору вместе с другими переменными для генерации окончательного значения.

HTML:

  <div class="garage-block">
      <input type="checkbox" class='g1' name='garage'/>1</label>
      <input type="checkbox" class='g2' name='garage'/>2</label>
      <input type="checkbox" class='g3' name='garage'/>3</label>
  </div>

JS:

    let g1 = document.querySelector('.g1');
    let g2 = document.querySelector('.g2');
    let g3 = document.querySelector('.g3');
    let garageVal;
    if(g1.checked = true){
       garageVal = 15000;
    }else if(g2.checked = true){
       garageVal = 30000;
    } else if(g3.checked = true){
       garageVal = 45000;
    }
    console.log(garageVal);

Консоль покажет 15000 по умолчаниюНесмотря на все усилия, я не смог обновить garageVal.

Answer 1

Ваши операторы if и elseif запускаются сразу после загрузки скрипта.Поэтому при загрузке страницы скрипт запускается, оценивает, какие флажки отмечены, а затем присваивает значение на основе вашего HTML.Вам необходимо добавить списки событий в каждый флажок, чтобы они обновлялись в реальном времени.Например:

g2.addEventListener("click", function(){
    // if statement to see if box is already checked or not
    if (g2.checked === false){
        g2.checked = true;
        garageVal = 30000;
    } else {
        g2.checked = false;
        // remove 3000 from garageVal, or whatever you need done when box is unchecked
    }
}, false);

Answer 2

if (g1.checked = true)

Все ваши условия - это присвоения, которые всегда равны true, особенно при первой проверке (присвоения - это выражения, которые оценивают присвоенное значение).

const obj = {}
const foo = (obj.rar = 'yasss!') // "=" is assignment, not comparison
console.log('obj.rar:', obj.rar) // 'yasss!', but you probably didn't expect this
console.log('foo:', foo)         // also 'yasss!', but you probably expected boolean

Измените = на === для сравнения:

if(g1.checked === true){
   garageVal = 15000;
}else if(g2.checked === true){
   garageVal = 30000;
} else if(g3.checked === true){
   garageVal = 45000;
}

или просто опустите сравнение, поскольку element.checked - логическое значениезначение уже.

if(g1.checked){
   garageVal = 15000;
}else if(g2.checked){
   garageVal = 30000;
} else if(g3.checked){
   garageVal = 45000;
}