我有多个重力形式的范围滑块.我想计算用户 Select 的总数并显示在屏幕上.JQuery可以工作,并且可以做它应该做的事情.
但是,我需要每个滑块的初始值为零,然后阻止它们超过$('.slider').val(0)
,但如果像其他地方建议的那样,使用jQuery将每个滑块的初始值设置为$('.slider').val(0)
,则#Total的值始终为零.如何在将初始值设置为零的同时仍获得#TOTAL以显示所有滑块值的总和?
$('.slider').on('change', function() {
var sum = 0;
$('.slider').each(function() {
sum += isNaN(this.value) || $.trim(this.value) === '' ? 0 : parseFloat(this.value);
});
$('#total').text(sum);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p id="total"></p>
<input name="input_1" id="input_1_1" type="number" step="1" min="0" max="100" value="50" class="slider" />
<input name="input_2" id="input_1_2" type="number" step="1" min="0" max="100" value="50" class="slider" />
<input name="input_3" id="input_1_3" type="number" step="1" min="0" max="100" value="50" class="slider" />