У меня на сайте есть небольшой калькулятор, который делает вычисления общей суммы после выбора нескольких опций. Я хотел бы добавить (для удобства) вот такой "бегунок" datalist состоящий из 10-и позиций:
<datalist id="rangeList">
<option value="4" label="4">
<option value="5" label="5">
<option value="6" label="6">
<option value="7" label="7">
<option value="8" label="8">
<option value="9" label="9">
<option value="10" label="10">
<option value="11" label="11">
<option value="12" label="12">
<option value="13" label="13">
<option value="14" label="14">
<option value="15" label="15">
</datalist>
и чтобы при передвижении бегунка, общая сумма вычислений менялась автоматически, при каждом шаге передвижения - на значение value="0_+100". как можно правильно добавить class="", id="", name="" в option value этого datalist, чтобы производились вычисления. Вот фрагмент кода этого калькулятора:
<div class="heady">
<input type="hidden" name="invote" class="invote">
<select name="srok" class="inputbox headnot">
<option value="0" sumfor="headnot">Выберите кол-во эффектов</option>
<option value="0_*1" sumup="10">1 эффект</option>
<option value="0_*1.5" sumup="20">2 эффекта</option>
<option value="0_*1.9" sumup="50">3 эффекта</option>
<option value="0_*2.4" sumup="70" >4 эффекта</option>
<option value="0_*3.0" sumup="100">5 эффектов</option>
<option value="0_*3.7" sumup="200">6 эффектов</option>
<option value="0_*4.5" sumup="300">7 эффектов</option>
<option value="0_*5.4" sumup="400">8 эффектов</option>
<option value="0_*6.5" sumup="500">9 эффектов</option>
</select>
<div class="heady">
<select name="sel[]" class="inputbox plag">
<option value="0_+0" sumend="0" class="headnot">Выберите опции вставки текста</option>
<option value="0_+0" sumend="0" class="headnot">Мне не нужно показывать текст</option>
<option value="0_+500" sumend="0" class="headnot">Вставка вашего текста в кол-ве, как в примере</option>
<option value="0_+800" sumend="0" class="headnot">Вставка вашего текста более 30-50% чем в примере</option>
<option value="0_+1000" sumend="0" class="headnot">Вставка вашего текста более 50-80% чем в примере</option>
<option value="0_+1200" sumend="0" class="headnot">Вставка вашего текста более 50-80% чем в примере</option>
</select>
</div>
<div class="count variant">
<input type="hidden" name="countone" class="countone" value="promt">
<label class="myCheckbox"><input type="radio" class="plat" name="plat" value="0_+0" checked="checked"><span class="chk"></span>Нет</label>
<label style="color: #0823C0" class="myCheckbox"><input type="radio" class="plat" name="plat" value="0_+200"><span class="chk"></span>SD карта</label>
<label style="color: #0823C0" class="myCheckbox"><input type="radio" class="plat" name="plat" value="0_+300"><span class="chk"></span>DVD запись</label></div>