我知道这已经被问到了。我检查了有关该主题的所有先前问题,但找不到解决方案。
这是问题:我有两个输入,一个是复选框,另一个是具有三个可能选择的收音机。在函数内部,我必须首先查看是否已选中第一个复选框,如果是,我将使用if else语句检查其他一些内容,否则该函数将继续进行。单选输入稍后会出现在同一功能内。该选项将检查先前已检查的三个选项中的哪一个,并将设置一个等于该选项的值的变量。要查看该复选框是否被选中,我将jQuery与.is(':checked')
一起使用,但是即使我选中了它们,它也会返回false
。有什么主意吗?
抱歉,如果我没有正确使用Stack Overflow,但这是我的第一个问题。
这是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();
相同,无法找到已检查的内容并设置了运动
您是否尝试过此[[$(“#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>
您显然没有将函数包装在$(document).ready
中,因此您在初始化之前检查状态,或者尝试在没有事件侦听器的情况下检查状态是否已更改。
如果要实时查看值,则需要将事件侦听器添加到change
状态。
最后,对于无线电,您需要检查.val()
,因为它们链接在一起。
$(document).ready(function(){
$("#geoloc_waypoint_active").on('change',function(){
if($('#geoloc_waypoint_active').is(':checked')){
console.log("Checkbox is checked.");
}
else if($('#geoloc_waypoint_active').is(':checked') === false){
console.log("Checkbox is unchecked.");
}
});
$('input[name=locomotion]').on('change',function(){
console.log($('input[name=locomotion]:checked').val());
})
})
<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>