Цикл для функции
Есть Select у которого есть id и с тремя option.
На странице есть <span id="priceraw2">Тут какое-то число</span> Мне нужно было, чтобы при смене опции менялось значение в этом id="priceraw2", например умножалось. Если стоит опция 1, то значение не меняется, если опция 2, то значение умножается на 20, если значение три, то умножается на 40. Решил таким образом, все отлично работает.
var default_result=document.getElementById('priceraw2').innerHTML;
(function(){
var sel=document.getElementById('currency-select');
my_func(sel);
})()
function my_func(sel){
var
opts=[],
opt,
val,
divider={'1':'1','2':'30','3':'40'},
result=default_result
;
for(var i=0;i<sel.options.length;i++){
opt=sel.options[i];
if(opt.selected){
val=opt.value;
opts.push(val);
val=divider[val];
}
}
if(opts.length==0){
result=default_result;
}else{
result=default_result*val;
result = Math.round(result);
}
document.getElementById('priceraw2').innerHTML=result;
}
Но как сделать, чтобы этот скрипт выполнялся везде и для всех? Например, на странице может быть 20 или 1000 блоков в которых есть <span id="priceraw2">Тут какое-то число</span>, но функция выполняется только для первого блока. На странице может быть еще всплывающее окно с <span id="priceraw2">Тут какое-то число</span>, как сделать, чтобы скрипт выполнялся для каждого блока и везде? |
orb,
id уникально :cray: и for нафиг |
мм... не понял
|
orb,
пару блоков нарисуйте как они у вас выглядят |
Вложений: 1
Скрипт, который выше все прекрасно делает, только вот изменения происходят для первого блока, а нужно, чтобы это происходило для каждого тега <span id="priceraw2"> </span> который есть на странице или появляется.
Причем еще на странице блоки могут подгружаться при скролле и нужно, чтобы скрипт это улавливал. Думал написать цикл, но что-то не вышло) |
orb,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
</head>
<body>
<select class="sel" name="" size="1">
<option value="1">1</option>
<option value="50">2</option>
<option value="20">3</option>
</select>
<span class="price" data-num="100"></span>
<span class="price" data-num="200"></span>
<span class="price" data-num="300"></span>
<script>
var sel = document.querySelector('.sel'), price = document.querySelectorAll('.price'),
fn = function() {
var val = this.value;
[].forEach.call(price, function(item) {
item.innerHTML = item.dataset.num * val + "$"
} )};
sel.addEventListener('change', fn);
fn.call(sel)
</script>
</body>
</html>
|
| Часовой пояс GMT +3, время: 20:53. |