HTML флажок ввода всегда возвращает ложь

Question

Я знаю, что это уже спрашивали. Я проверил все предыдущие вопросы об этой топике c, но не могу найти решение.

Это проблема: У меня два ввода, один - флажок, а другой - один - радио с тремя возможными вариантами. Внутри функции я должен сначала увидеть, установлен ли первый флажок, если да, я проверю некоторые другие вещи с помощью оператора if else, в противном случае функция продолжит работу. Радиовход появится позже внутри той же функции. Он проверит, какой из трех вариантов был проверен ранее, и установит переменную, равную значению проверенного. Чтобы проверить, установлен ли флажок, я использую jQuery с .is(':checked'), но каждый из них возвращает false, даже если я их проверял. Любая идея?

Извините, если я неправильно использовал переполнение стека, но это мой первый вопрос.

Это HTML, input - #geoloc_waypoint_active и радио - #locomotion_radio

<div id="create_route_modal_content" class="modal-body">
  <div id="geo_switch">
    <div id="geoSwitchDiv">
      <label for="geoloc_waypoint_active">
      Usa la tua posizione
      </label>
      <label class="switch">
        <input id="geoloc_waypoint_active" class="form-check form-check-inline" type="checkbox">
        <span class="slider round"></span>
      </label>
    </div>
    <br>
    <div id="locomotion_radio">
      <label><input class="locomInput" type="radio" name="locomotion" value="walking" checked><img class='locomotionImg' src='immagini/walking.png'></label>
      <label><input class="locomInput" type="radio" name="locomotion" value="cycling"><img class='locomotionImg' src='immagini/cycling.png'></label>
      <label><input class="locomInput" type="radio" name="locomotion" value="driving"><img class='locomotionImg' src='immagini/driving.png'></label>
    </div>      

DrawOnMap() {
  let formattedCoord = "";
  let geoposition = $('#geoloc_waypoint_active').is(':checked');
  console.log(geoposition)
  if (geoposition) {
    var geoL = $('#geo_Locator .mapboxgl-ctrl .mapboxgl-ctrl-icon');
    if (!map.getLayer('points') && geoL.attr('aria-pressed') === 'false') {
      alert("L'utente non ha una posizione attualmente attiva.");
      return;
    } else {
      this.waypoints.unshift(window.userPosition);
    }
  }

  if (this.waypoints.length < 2) {
    alert("Devi inserire almeno due punti di interesse.");
    return;
  }

  this.waypoints.forEach((waypoint, index, source) => {
    formattedCoord += waypoint[0] + "," + waypoint[1];
    if (index < source.length - 1) {
      formattedCoord += ";";
    }
  });

  let locomotion = $('input[name=locomotion]:checked').val();

let geoposition = $('#geoloc_waypoint_active').is(':checked'); всегда false, и поэтому оно никогда не вводит if

То же самое с let locomotion = $('input[name=locomotion]:checked').val(); Не удается найти проверил один и установил локомоцию

Answer 1

пытались ли вы это $ ("# geoloc_waypoint_active") [0] .checked это даст вам правильное значение управления.

$(document).ready(function(){
 console.log($("#geoloc_waypoint_active")[0].checked)
 $('#check').on('click',function(){
    console.log($("#geoloc_waypoint_active")[0].checked)
 })
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input value='checkVakue' type='button' id='check'/>
<div id="create_route_modal_content" class="modal-body">
  <div id="geo_switch">
    <div id="geoSwitchDiv">
      <label for="geoloc_waypoint_active">
      Usa la tua posizione
      </label>
      <label class="switch">
        <input id="geoloc_waypoint_active" class="form-check form-check-inline" type="checkbox">
        <span class="slider round"></span>
      </label>
    </div>
    <br>
    <div id="locomotion_radio">
      <label><input class="locomInput" type="radio" name="locomotion" value="walking" checked><img class='locomotionImg' src='immagini/walking.png'></label>
      <label><input class="locomInput" type="radio" name="locomotion" value="cycling"><img class='locomotionImg' src='immagini/cycling.png'></label>
      <label><input class="locomInput" type="radio" name="locomotion" value="driving"><img class='locomotionImg' src='immagini/driving.png'></label>
    </div>