我尝试使用几个选择字段来修改一个数字起始点。选择字段包含一些负数,因此我想相应地加/减。我目前还不能用JQuery做到这一点--所以我试着用直接的javascript来解决这个问题。我已经走到这一步了,但它只适用于单个选择字段。出于同样的原因,我不确定负数是否会减去:
<select class="select1 selectables" id="dropdown-1" name="dropdown1">
<option disabled="disabled" selected="selected" value="">select</option>
<option value="10">Choice 1 (plus 10)</option>
<option value="-5">Choice 2 (minus 5)</option>
<option value="60">Choice 3 (plus 60)</option>
</select>
<br />
<select class="select2 selectables" id="dropdown-2" name="dropdown2">
<option disabled="disabled" selected="selected" value="">select</option>
<option value="5">Choice A (plus 10)</option>
<option value="15">Choice B (minus 10)</option>
<option value="15">Choice C (plus 15)</option>
</select>
<br />
<select class="select3 selectables" id="dropdown-3" name="dropdown3">
<option disabled="disabled" selected="selected" value="">select</option>
<option value="5">Choice ii (- 35)</option>
<option value="15">Choice ii (plus 15)</option>
<option value="12">Choice iii (plus 12)</option>
</select>
<script>
document.addEventListener("DOMContentLoaded", function(event) {
var gg1 = new JustGage({
id: "gg1",
value: 0
// removed elements, as this area isn't an issue
});
document.getElementById('dropdown-1').addEventListener('change', (event) => {
sum = 0;
testvar = event.target.value;
if (testvar > 0) {
sum = (sum + testvar);
alert(`up ${testvar}`);
} else if (testvar < 1) {
sum = (sum - parseInt(testvar, 10));
alert(`down ${testvar}`);
}
gg1.refresh(sum);
return false;
});
</script>
发布于 2019-04-25 23:54:34
对于负数,您不需要特殊处理。只需将它们相加,就像处理正数一样。在下面的代码片段中,我将负选项的值更改为它们的实际负值。然后,calculateSum()
计算所有方框的总和。不只是改变了的那个。虽然增量版本绝对是可能的,但没有理由只用三个盒子就能做到。而且这个增量变体更有可能有bug。
document.addEventListener("DOMContentLoaded", function(event) {
document.getElementById('dropdown-1').addEventListener('change', calculateSum);
document.getElementById('dropdown-2').addEventListener('change', calculateSum);
document.getElementById('dropdown-3').addEventListener('change', calculateSum);
});
function calculateSum() {
sum = 0;
//iterate all three boxes
for (var i = 1; i <= 3; ++i) {
var box = document.getElementById('dropdown-' + i);
var value = parseInt(box.value);
if (!isNaN(value))
sum += value;
}
alert(sum);
return false;
}
<select class="select1 selectables" id="dropdown-1" name="dropdown1">
<option disabled="disabled" selected="selected" value="">select</option>
<option value="10">Choice 1 (plus 10)</option>
<option value="-5">Choice 2 (minus 5)</option>
<option value="60">Choice 3 (plus 60)</option>
</select>
<br />
<select class="select2 selectables" id="dropdown-2" name="dropdown2">
<option disabled="disabled" selected="selected" value="">select</option>
<option value="10">Choice A (plus 10)</option>
<option value="-10">Choice B (minus 10)</option>
<option value="15">Choice C (plus 15)</option>
</select>
<br />
<select class="select3 selectables" id="dropdown-3" name="dropdown3">
<option disabled="disabled" selected="selected" value="">select</option>
<option value="-35">Choice ii (- 35)</option>
<option value="15">Choice ii (plus 15)</option>
<option value="12">Choice iii (plus 12)</option>
</select>
https://stackoverflow.com/questions/55852626
复制相似问题