如果选择了newStatus
或usedStatus
的任何选项,但仅针对所选的选项,我将尝试设置这两个选项的值。
现在,如果您选择"New mowers“,然后单击其中一个选项,您将在控制台中看到New Selection1
和Used Selection
显示在控制台中。对于此示例和功能,应该只显示New Selection1
。
下面的if语句控制着它:
if ("input:checkbox[name=newMowerOption]:checked") {
newStatus = '1';
console.log('New Selection' + newStatus);
}
if ("input:checkbox[name=usedMowerOption]:checked") {
usedStatus = '1';
console.log('Used Selection' + usedStatus);
}
您可以看到,我正在根据名称检查特定的复选框,所以我不确定为什么如果您选择了一个新的割草机选项,那么used也会被选中。
有谁有主意吗?
var newStatus = ''; //Telling whether new is selected
var usedStatus = ''; //Telling whether used is selected
var newSelPush = '';
var usedSelPush = '';
$('.equipmentOptionCont').change(function() {
var newSel = [];
var usedSel = [];
//Get new mower options
$("input:checkbox[name=newMowerOption]:checked").each(function(){
newSel.push($(this).val());
newSelPush = newSel.join(', ');
});
//Get used mower options
$("input:checkbox[name=usedMowerOption]:checked").each(function(){
usedSel.push($(this).val());
usedSelPush = usedSel.join(', ');
});
//Find out if new/used mower option is selected and then create variable showing 1 if true
if ("input:checkbox[name=newMowerOption]:checked") {
newStatus = '1';
console.log('New Selection' + newStatus);
}
if ("input:checkbox[name=usedMowerOption]:checked") {
usedStatus = '1';
console.log('Used Selection' + usedStatus);
}
$('#newSel').html(newSelPush);
$('#usedSel').html(usedSelPush);
});
$('#newAllOptions').click(function() {
$('input[name=newMowerOption').toggle().prop('checked', true);
});
$('#usedAllOptions').click(function() {
$('input[name=usedMowerOption').toggle().prop('checked', true);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label>New Mowers</label>
<input type="radio" name="notifymethod" id="newMowerSelect" class="equipmentMainSel">
<label>Used Mowers</label>
<input type="radio" name="notifymethod" id="usedMowerSelect" class="equipmentMainSel">
<div id="newMowerOptions" class="equipmentOptionCont">
<p>New Mower Options</p>
<label>Ferris</label>
<input type="checkbox" name="newMowerOption" value="Ferris">
<label>Wright</label>
<input type="checkbox" name="newMowerOption" value="Wright">
</div>
<div id="usedMowerOptions" class="equipmentOptionCont">
<p>Used Mower Options</p>
<label>Toro</label>
<input type="checkbox" name="usedMowerOption" value="Toro">
<label>John Deere</label>
<input type="checkbox" name="usedMowerOption" value="John Deere">
</div>
发布于 2019-05-23 03:12:21
更改逻辑以获得所需的结果。
var newStatus = ''; //Telling whether new is selected
var usedStatus = ''; //Telling whether used is selected
var newSelPush = '';
var usedSelPush = '';
$('.equipmentOptionCont').change(function() {
var newSel = [];
var usedSel = [];
//Get new mower options
$("input:checkbox[name=newMowerOption]:checked").each(function(){
newSel.push($(this).val());
newSelPush = newSel.join(', ');
});
//Get used mower options
$("input:checkbox[name=usedMowerOption]:checked").each(function(){
usedSel.push($(this).val());
usedSelPush = usedSel.join(', ');
});
var radioSelID = $("input:radio[name=notifymethod]:checked").attr('id');
if(newSel.length && radioSelID == "newMowerSelect") {
newStatus = '1';
console.log('New Selection' + newStatus);
}
if(usedSel.length && radioSelID == "usedMowerSelect") {
usedStatus = '1';
console.log('Used Selection' + usedStatus);
}
$('#newSel').html(newSelPush);
$('#usedSel').html(usedSelPush);
});
$('#newAllOptions').click(function() {
$('input[name=newMowerOption').toggle().prop('checked', true);
});
$('#usedAllOptions').click(function() {
$('input[name=usedMowerOption').toggle().prop('checked', true);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label>New Mowers</label>
<input type="radio" name="notifymethod" id="newMowerSelect" class="equipmentMainSel">
<label>Used Mowers</label>
<input type="radio" name="notifymethod" id="usedMowerSelect" class="equipmentMainSel">
<div id="newMowerOptions" class="equipmentOptionCont">
<p>New Mower Options</p>
<label>Ferris</label>
<input type="checkbox" name="newMowerOption" value="Ferris">
<label>Wright</label>
<input type="checkbox" name="newMowerOption" value="Wright">
</div>
<div id="usedMowerOptions" class="equipmentOptionCont">
<p>Used Mower Options</p>
<label>Toro</label>
<input type="checkbox" name="usedMowerOption" value="Toro">
<label>John Deere</label>
<input type="checkbox" name="usedMowerOption" value="John Deere">
</div>
的老答案:
您的if
语句只是检查一个字符串,在JavaScript中,该字符串总是返回true
,因此这两个字符串都被打印出来。我改变了它来检查实际的属性,有几种不同的方法可以做到这一点,但是下面的方法是你想要的。
https://stackoverflow.com/questions/56263226
复制相似问题