Question

This code works in Chrome, but not in IE. Why?? It’s so simple but I don’t see my mistake.

<script>

function calc() {

        var summ = (parseFloat(q2.value) + parseFloat(q3.value) + parseFloat(q4.value)+ ( parseFloat(qn2.value) + parseFloat(qn3.value) + parseFloat(qn4.value) ) * 6 ) * 1.13;

        summ = parseFloat(summ).toFixed(2);

        document.getElementById('sum2').innerHTML = summ;

        alert(summ);
}

</ script>

And html (delete all text, only input)

<form method="" action="">

<input type="number" onClick="calc();" onChange="calc();" onblur="if (this.value == '') {this.value = '00.00';}" value="00.00" maxlength="14" size="4" id="q2"/>

<input type="number" onClick="calc();" onChange="calc();" onblur="if (this.value == '') {this.value = '00.00';}" value="00.00" maxlength="14" size="4" id="q3"/>

<input type="number" onClick="calc();" onChange="calc();" onblur="if (this.value == '') {this.value = '00.00';}" value="00.00" maxlength="14" size="4" id="q4"/>

<input type="number" onClick="calc();" onChange="calc();" onblur="if (this.value == '') {this.value = '0';}" value="0" maxlength="14" size="4" id="qn2"/>

<input type="number" onClick="calc();" onChange="calc();" onblur="if (this.value == '') {this.value = '0';}" value="0" maxlength="14" size="4" id="qn3"/>

<input type="number" onClick="calc();" onChange="calc();" onblur="if (this.value == '') {this.value = '0';}" value="0" maxlength="14" size="4" id="qn4"/>


<p><span id="sum2" style="color: red; font-weight: bold;">00.00</span> the result</p>   

<center><input type='button' onclick='calc()' value='Обновить'/></center>

</ html>

What am I doing wrong? I already found that IE doesn’t like name="..." tag and deletes all of them from the code.

Answer 1

Look at the console, it tells you there are errors

SCRIPT5009: 'q2' is undefined show, line 22 character 9

Do not reference elements by their id directly, you need to use document.getElementById()

What you need to do is

parseFloat(document.getElementById("q2").value)