Estou criando uma função que pega os valores de uma tabela que estão em range, 1-49, 50-99, 100-199, ..., 300+, o código pega o valor de um input e baseado neste valor identifica o range e calcula o valor do produto.
Até agora o código funciona bem, pegando o valor do input, o que acontece é que quando o valor do input está em 1000 ele executa o 3º if ao invés do 5º, acredito que seja algum problema com os if encadeados, mas não consigo visualizar. Alguém me ajuda? (ps. pfv não me xinguem pq escrevi variáveis começando com letra maiúscula)
var Th1 = document.getElementById('th_1').innerHTML;
var Th2 = document.getElementById('th_2').innerHTML;
var Th3 = document.getElementById('th_3').innerHTML;
var Th4 = document.getElementById('th_4').innerHTML;
var Th5 = document.getElementById('th_5').innerHTML;
var Vl1 = Th1.slice(0, Th1.indexOf("-"));
var Vl2 = Th1.slice(Th1.indexOf("-") + 1);
var Vl3 = Th2.slice(0, Th2.indexOf("-"));
var Vl4 = Th2.slice(Th2.indexOf("-") + 1);
var Vl5 = Th3.slice(0, Th3.indexOf("-"));
var Vl6 = Th3.slice(Th3.indexOf("-") + 1);
var Vl7 = Th4.slice(0, Th4.indexOf("-"));
var Vl8 = Th4.slice(Th4.indexOf("-") + 1);
var Vl9 = Th5.slice(0, Th5.indexOf("+"));
var Vl10 = Th5.slice(Th5.indexOf("+") + 1);
var q = Number(document.getElementById('pwrqto').value);
var s = document.getElementById('xprice');
//se o valor estiver no range 1
if((q >= Vl1) && (q <= Vl2)){
var cat = document.getElementById('rs_0');
var child = cat.childNodes[0].innerHTML;
var cleanCp = child.slice(child.indexOf(";") + 1);
s.innerHTML = 'R$ ' + Math.ceil(cleanCp.replace(",", ".") * q) + ',00';
}
//se o valor estiver no range 2
if((q >= Vl3) && (q <= Vl4)){
var cat = document.getElementById('rs_1');
var child = cat.childNodes[0].innerHTML;
var cleanCp = child.slice(child.indexOf(";") + 1);
s.innerHTML = 'R$ ' + Math.ceil(cleanCp.replace(",", ".") * q) + ',00';
}
//se o valor estiver no range 3
if((q >= Vl5) && (q <= Vl6)){
var cat = document.getElementById('rs_2');
var child = cat.childNodes[0].innerHTML;
var cleanCp = child.slice(child.indexOf(";") + 1);
s.innerHTML = 'R$ ' + Math.ceil(cleanCp.replace(",", ".") * q) + ',00';
}
//se o valor estiver no range 4
if((q >= Vl7) && (q <= Vl8)){
var cat = document.getElementById('rs_3');
var child = cat.childNodes[0].innerHTML;
var cleanCp = child.slice(child.indexOf(";") + 1);
s.innerHTML = 'R$ ' + Math.ceil(cleanCp.replace(",", ".") * q) + ',00';
}
//se o valor estiver no range 5
if(q >= Vl9) {
var cat = document.getElementById('rs_4');
var child = cat.childNodes[0].innerHTML;
var cleanCp = child.slice(child.indexOf(";") + 1);
s.innerHTML = 'R$ ' + Math.ceil(cleanCp.replace(",", ".") * q) + ',00';
}
Abaixo o Código HTML
<table><tbody>
<tr class="wc_quantity">
<th id="th_1">1-49</th>
<th id="th_2">50-99</th>
<th id="th_3">100-199</th>
<th id="th_4">200-299</th>
<th id="th_5">300+</th>
</tr>
<tr class="wc_price">
<td align="center" id="rs_0"><span class="amount">R$ 10,00</span></td>
<td align="center" id="rs_1"><span class="amount">R$ 9,50</span></td>
<td align="center" id="rs_2"><span class="amount">R$ 9,30</span></td>
<td align="center" id="rs_3"><span class="amount">R$ 9,20</span></td>
<td align="center" id="rs_4"><span class="amount">R$ 9,10</span></td>
</tr>