javascript werkt niet in Firefox

[kritinet]

ik heb een javascript voor een berekening op mijn website. het werkt aleen niet bij firefox. kan me iemand helpen wat er fout an is ?
hier de script
script language= "JavaScript">
<!--
<!--
function rekenen1(){


var box1=document.rekenen.box1.value;
var box2=document.rekenen.box2.value;
var box3=box1*box2;
box3=box3;
document.rekenen.box3.value=box3;

var box4=document.rekenen.box4.value;
var box5=document.rekenen.box5.value;
var box6=box4*box5;
box6=box6;
document.rekenen.box6.value=box6;

var box7=document.rekenen.box7.value;
var box8=document.rekenen.box8.value;
var box9=box7*box8;
box9=box9;
document.rekenen.box9.value=box9;

var box10=document.rekenen.box10.value;
var box11=document.rekenen.box11.value;
var box12=box3+box6+box9;
box12=box12;
document.rekenen.box12.value=box12;

var box13=document.rekenen.box13.value;
var box14=document.rekenen.box14.value;
var box15=-box12/100*20;
box15=box15;
document.rekenen.box15.value=box15;

var box16=document.rekenen.box16.value;
var box17=document.rekenen.box17.value;
var box18=box12+box15;
box18=box18;
document.rekenen.box18.value=box18;

var box19=document.rekenen.box19.value;
var box20=document.rekenen.box20.value;
var box21=15;
box21=box21;
document.rekenen.box21.value=box21;

var box22=document.rekenen.box22.value;
var box23=document.rekenen.box23.value;
var box24=box18+box21;
box24=box24;
document.rekenen.box24.value=box24;

}

//-->
</script>

<form name='rekenen'><table border="0" cellspacing="3">
<tr>
<td colspan="2" align="left" valign="baseline">

<input title="vul hier het bedrag in volgens de prijslijst !" name='box1' type='text' style=" font-size:16px;text-align:right; color:#164871" size="2" maxlength="10"> &euro; p.persoon </td>
<td align="left" valign="baseline" style=" font-size:16px; color:#164871">
<select name='box2' style=" border:0px; background-color:transparent; font-size:16px; color:#164871">
<option selected="selected">Aantal Volw.</option>
<option value="2">2 Volwassenen</option>
<option value="3">3 Volwassenen</option>
</select></td>

<td align="right" valign="baseline"><input name='box3' type='text' style="text-align:right;border:0px; background-color:transparent; font-size:16px; color:#164871" size="2" maxlength="10">
&euro;</td>
</tr>
<tr>
<td colspan="2" align="left" valign="baseline"><input title="vul hier het bedrag in volgens de prijslijst !" name='box4' type='text' style="text-align:right; font-size:16px; color:#164871" size="2" maxlength="10">
&euro; p.kind </td>
<td align="left" valign="baseline" style=" font-size:16px; color:#164871"><select name='box5' style="border:0px; background-color:transparent; font-size:16px; color:#164871">
<option>Aantal Kinderen</option>


<option value="0">0 kinderen</option>
<option value="1">1 kind</option>
<option value="2">2 kinderen</option>
</select>
<span class="Text"><em>2&lt;12 jr</em></span></td>
<td align="right" valign="baseline"><input name='box6' type='text' style="border:0px; background-color:transparent; text-align:right; font-size:16px; color:#164871" size="2" maxlength="10">
&euro;</td>

</tr>

<tr>
<td colspan="2" align="left" valign="baseline"><input name='box7' type='text' style="border:0px; background-color:transparent; text-align:right; font-size:16px; color:#164871" value="60" size="2" maxlength="10">
&euro; p. baby </td>
<td align="left" valign="baseline"style=" font-size:16px; color:#164871" ><select name='box8' style="border:0px; background-color:transparent; font-size:16px; color:#164871">
<option>Aantal Baby´s</option>
<option value="0">0 Babys</option>

<option value="1">1 Baby</option>
<option value="2">2 Babys</option>
</select>
<span class="Text"><em>0&lt; 2jr</em></span> </td>
<td align="right" valign="baseline"><input name='box9' type='text' style="text-align:right;border:0px; background-color:transparent; font-size:16px; color:#164871" size="2" maxlength="10">
&euro;</td>

</tr>

<tr>
<td align="left" valign="baseline"><div style="visibility:hidden; "><input name='box10' type='text' size="2" maxlength="10" />
</div></td>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box11' type='text' size="2" maxlength="10" />
</div></td>
<td align="right" valign="baseline" style=" font-size:16px; color:#164871">Subtotaal 1 </td>
<td align="right" valign="baseline"><input name='box12' type='text' style="text-align:right; border:0px; background-color:transparent; font-size:16px; color:#164871" size="2" maxlength="10">
&euro;</td>

</tr>
<tr>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box13' type='text' size="2" maxlength="10" />
</div></td>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box14' type='text' size="2" maxlength="10" />
</div></td>
<td align="right" valign="baseline" style=" font-size:16px; color:#164871"><strong>20%</strong> Vroegboekkorting</td>

<td align="right" valign="baseline"><input name='box15' type='text' style="border:0px; background-color:transparent; text-align:right; font-size:16px; color: #FF0000" size="2" maxlength="10">
&euro;</td>
</tr>
<tr>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box16' type='text' size="2" maxlength="10" />
</div></td>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box17' type='text' size="2" maxlength="10" />
</div></td>
<td align="right" valign="baseline" style=" font-size:16px; color:#164871">Subtotaal 2 </td>

<td align="right" valign="baseline"><input name='box18' type='text' style="border:0px; background-color:transparent; text-align:right; font-size:16px; color:#164871" size="2" maxlength="10">
&euro;</td>
</tr>
<tr>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box19' type='text' size="2" maxlength="10" />
</div></td>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box20' type='text' size="2" maxlength="10" />
</div></td>
<td align="right" valign="baseline" style=" font-size:16px; color:#164871">Reserveringskosten</td>

<td align="right" valign="baseline"><input name='box21' type='text'
style="text-align:right; border:0px; background-color:transparent; font-size:16px; color:#164871" size="2" maxlength="10" >
&euro;</td>
</tr>
<tr>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box22' type='text' size="2" maxlength="10" />
</div></td>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box23' type='text' size="2" maxlength="10" />
</div></td>
<td align="right" valign="baseline" style=" font-size:16px; color:#164871"><strong>Eindtotaal</strong></td>

<td align="right" valign="baseline"><input name='box24' type='text' style="border:0px; background-color:transparent; text-align:right; font-size:18px; text-decoration:underline; font-weight:bold; color:#164871" size="3" maxlength="10">

&euro;</td>
</tr>
<tr>
<td colspan="4" align="right" valign="baseline"><input type='button' name='uitrekenen' style="font-size:16px; color:#164871" onclick="rekenen1()" value='Bereken eindbedrag!' /> <input type="reset" name="Reset2" style=" font-size:16px; color:#164871" value=" Wissen"/></td>
</tr>

</table>
</form>

hier kun je het bekijken
http://www.island-travel.kritinet.com/Pela_Mare_Hotel_agia_pelagia_appartementen_studios_Kreta.html

 

[Egel]

Je kreeg af en toe NaN bij Firefox neem ik aan.

In dit script zit een beveiling daartegen:

<script type="text/javascript">
<!--

function rekenen1() {

var r = document.rekenen;

var box1 = parseInt(r.box1.value);
if (isNaN(box1)) box1 = 0;
r.box1.value = box1;
var box2 = r.box2.value;
var box3 = box1 * box2;
r.box3.value = box3;

var box4 = parseInt(r.box4.value);
if (isNaN(box4)) box4 = 0;
r.box4.value = box4;
var box5 = r.box5.value;
var box6 = box4 * box5;
r.box6.value = box6;

var box7 = r.box7.value;
var box8 = r.box8.value;
var box9 = box7 * box8;
r.box9.value = box9;

var box10 = r.box10.value;
var box11 = r.box11.value;
var box12 = box3 + box6 + box9;
r.box12.value = box12;

var box13 = r.box13.value;
var box14 = r.box14.value;
var box15 = -box12 * 0.20;
r.box15.value = box15;

var box16 = r.box16.value;
var box17 = r.box17.value;
var box18 = box12 + box15;
r.box18.value = box18;

var box19 = r.box19.value;
var box20 = r.box20.value;
var box21 = 15;
r.box21.value = box21;

var box22 = r.box22.value;
var box23 = r.box23.value;
var box24 = box18 + box21;
r.box24.value = box24;

};

//-->
</script> 

<form name="rekenen"><table border="0" cellspacing="3">
<tr>
<td colspan="2" align="left" valign="baseline">

<input title="vul hier het bedrag in volgens de prijslijst !" name='box1' type='text' style=" font-size:16px;text-align:right; color:#164871" size="2" maxlength="10"> &euro; p.persoon </td>
<td align="left" valign="baseline" style=" font-size:16px; color:#164871">
<select name='box2' style=" border:0px; background-color:transparent; font-size:16px; color:#164871">
<option value="0" selected="selected">Aantal Volw.</option>
<option value="1">1 Volwassene</option>
<option value="2">2 Volwassenen</option>
<option value="3">3 Volwassenen</option> 
<option value="4">4 Volwassenen</option> 
</select></td>

<td align="right" valign="baseline"><input name='box3' type='text' style="text-align:right;border:0px; background-color:transparent; font-size:16px; color:#164871" size="2" maxlength="10">
&euro;</td>
</tr>
<tr>
<td colspan="2" align="left" valign="baseline"><input title="vul hier het bedrag in volgens de prijslijst !" name='box4' type='text' style="text-align:right; font-size:16px; color:#164871" size="2" maxlength="10">
&euro; p.kind </td>
<td align="left" valign="baseline" style=" font-size:16px; color:#164871"><select name='box5' style="border:0px; background-color:transparent; font-size:16px; color:#164871">
<option>Aantal Kinderen</option>
<option value="0">0 kinderen</option>
<option value="1">1 kind</option>
<option value="2">2 kinderen</option> 
<option value="3">3 kinderen</option> 
<option value="4">4 kinderen</option> 
</select>
<span class="Text"><em>2&lt;12 jr</em></span></td>
<td align="right" valign="baseline"><input name='box6' type='text' style="border:0px; background-color:transparent; text-align:right; font-size:16px; color:#164871" size="2" maxlength="10">
&euro;</td>

</tr>

<tr>
<td colspan="2" align="left" valign="baseline"><input name='box7' type='text' style="border:0px; background-color:transparent; text-align:right; font-size:16px; color:#164871" value="60" size="2" maxlength="10">
&euro; p. baby </td>
<td align="left" valign="baseline"style=" font-size:16px; color:#164871" ><select name='box8' style="border:0px; background-color:transparent; font-size:16px; color:#164871">
<option>Aantal Baby's</option>
<option value="0">0 Baby's</option>
<option value="1">1 Baby</option>
<option value="2">2 Baby's</option>
<option value="3">3 Baby's</option>
<option value="4">4 Baby's</option>
</select>
<span class="Text"><em>0&lt; 2jr</em></span> </td>
<td align="right" valign="baseline"><input name='box9' type='text' style="text-align:right;border:0px; background-color:transparent; font-size:16px; color:#164871" size="2" maxlength="10">
&euro;</td>

</tr>

<tr>
<td align="left" valign="baseline"><div style="visibility:hidden; "><input name='box10' type='text' size="2" maxlength="10" />
</div></td>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box11' type='text' size="2" maxlength="10" />
</div></td>
<td align="right" valign="baseline" style=" font-size:16px; color:#164871">Subtotaal 1 </td>
<td align="right" valign="baseline"><input name='box12' type='text' style="text-align:right; border:0px; background-color:transparent; font-size:16px; color:#164871" size="2" maxlength="10"> 
&euro;</td>

</tr>
<tr>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box13' type='text' size="2" maxlength="10" />
</div></td>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box14' type='text' size="2" maxlength="10" />
</div></td>
<td align="right" valign="baseline" style=" font-size:16px; color:#164871"><strong>20%</strong> Vroegboekkorting</td>

<td align="right" valign="baseline"><input name='box15' type='text' style="border:0px; background-color:transparent; text-align:right; font-size:16px; color: #FF0000" size="2" maxlength="10"> 
&euro;</td>
</tr>
<tr>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box16' type='text' size="2" maxlength="10" />
</div></td>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box17' type='text' size="2" maxlength="10" />
</div></td>
<td align="right" valign="baseline" style=" font-size:16px; color:#164871">Subtotaal 2 </td>

<td align="right" valign="baseline"><input name='box18' type='text' style="border:0px; background-color:transparent; text-align:right; font-size:16px; color:#164871" size="2" maxlength="10"> 
&euro;</td>
</tr>
<tr>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box19' type='text' size="2" maxlength="10" />
</div></td>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box20' type='text' size="2" maxlength="10" />
</div></td>
<td align="right" valign="baseline" style=" font-size:16px; color:#164871">Reserveringskosten</td>

<td align="right" valign="baseline"><input name='box21' type='text' 
style="text-align:right; border:0px; background-color:transparent; font-size:16px; color:#164871" size="2" maxlength="10" > 
&euro;</td>
</tr>
<tr>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box22' type='text' size="2" maxlength="10" />
</div></td>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box23' type='text' size="2" maxlength="10" />
</div></td>
<td align="right" valign="baseline" style=" font-size:16px; color:#164871"><strong>Eindtotaal</strong></td>

<td align="right" valign="baseline"><input name='box24' type='text' style="border:0px; background-color:transparent; text-align:right; font-size:18px; text-decoration:underline; font-weight:bold; color:#164871" size="3" maxlength="10"> 

&euro;</td>
</tr>
<tr>
<td colspan="4" align="right" valign="baseline"><input type='button' name='uitrekenen' style="font-size:16px; color:#164871" onclick="rekenen1()" value='Bereken eindbedrag!' /> <input type="reset" name="Reset2" style=" font-size:16px; color:#164871" value=" Wissen"/></td>
</tr>

</table>
</form>

En je had een keer <!-- teveel en bij 0 volwassenen stond geen value="0" in de select.

Het lijkt al wel goed te werken maar ik zou de text-vakjes wel iets groter maken.


Vr.Gr. Egel.

P.s.
Je kunt zo'n lange broncode het beste tussen

tags plaatsen.

 

[kritinet]

super dank je ! Dat werkt nu !
Nu wil ik alleen nog afronden op 2 decimalen achter de komma .
Suggesties?
Bvd

 

[Egel]

Ja hoor:

<script type="text/javascript">
<!--

function rekenen1() {

var r = document.rekenen;

var box1 = parseFloat(r.box1.value);
if (isNaN(box1)) box1 = 0;
box1 = Math.floor(box1 * 100) / 100;
r.box1.value = box1.toFixed(2);
var box2 = r.box2.value;
var box3 = box1 * box2;
r.box3.value = box3.toFixed(2);

var box4 = parseFloat(r.box4.value);
if (isNaN(box4)) box4 = 0;
box4 = Math.floor(box4 * 100) / 100;
r.box4.value = box4.toFixed(2);
var box5 = r.box5.value;
var box6 = box4 * box5;
r.box6.value = box6.toFixed(2);

var box7 = r.box7.value;
var box8 = r.box8.value;
var box9 = box7 * box8;
r.box9.value = box9.toFixed(2);

var box10 = r.box10.value;
var box11 = r.box11.value;
var box12 = box3 + box6 + box9;
r.box12.value = box12.toFixed(2);

var box13 = r.box13.value;
var box14 = r.box14.value;
var box15 = -Math.ceil(box12 * 20) / 100;
r.box15.value = box15.toFixed(2);

var box16 = r.box16.value;
var box17 = r.box17.value;
var box18 = box12 + box15;
r.box18.value = box18.toFixed(2);

var box19 = r.box19.value;
var box20 = r.box20.value;
var box21 = 15;
r.box21.value = box21.toFixed(2);

var box22 = r.box22.value;
var box23 = r.box23.value;
var box24 = box18 + box21;
r.box24.value = box24.toFixed(2);

};

//-->
</script> 

<form name="rekenen"><table border="0" cellspacing="3">
<tr>
<td colspan="2" align="left" valign="baseline">

<input title="vul hier het bedrag in volgens de prijslijst !" name='box1' type='text' style=" font-size:16px;text-align:right; color:#164871" size="6" maxlength="10"> &euro; p.persoon </td>
<td align="left" valign="baseline" style=" font-size:16px; color:#164871">
<select name='box2' style=" border:0px; background-color:transparent; font-size:16px; color:#164871">
<option value="0" selected="selected">Aantal Volw.</option>
<option value="1">1 Volwassene</option>
<option value="2">2 Volwassenen</option>
<option value="3">3 Volwassenen</option> 
<option value="4">4 Volwassenen</option> 
</select></td>

<td align="right" valign="baseline"><input name='box3' type='text' style="text-align:right;border:0px; background-color:transparent; font-size:16px; color:#164871" size="6" maxlength="10">
&euro;</td>
</tr>
<tr>
<td colspan="2" align="left" valign="baseline"><input title="vul hier het bedrag in volgens de prijslijst !" name='box4' type='text' style="text-align:right; font-size:16px; color:#164871" size="6" maxlength="10">
&euro; p.kind </td>
<td align="left" valign="baseline" style=" font-size:16px; color:#164871"><select name='box5' style="border:0px; background-color:transparent; font-size:16px; color:#164871">
<option>Aantal Kinderen</option>
<option value="0">0 kinderen</option>
<option value="1">1 kind</option>
<option value="2">2 kinderen</option> 
<option value="3">3 kinderen</option> 
<option value="4">4 kinderen</option> 
</select>
<span class="Text"><em>2&lt;12 jr</em></span></td>
<td align="right" valign="baseline"><input name='box6' type='text' style="border:0px; background-color:transparent; text-align:right; font-size:16px; color:#164871" size="6" maxlength="10">
&euro;</td>

</tr>

<tr>
<td colspan="2" align="left" valign="baseline"><input name='box7' type='text' style="border:0px; background-color:transparent; text-align:right; font-size:16px; color:#164871" value="60" size="6" maxlength="10">
&euro; p. baby </td>
<td align="left" valign="baseline"style=" font-size:16px; color:#164871" ><select name='box8' style="border:0px; background-color:transparent; font-size:16px; color:#164871">
<option>Aantal Baby's</option>
<option value="0">0 Baby's</option>
<option value="1">1 Baby</option>
<option value="2">2 Baby's</option>
<option value="3">3 Baby's</option>
<option value="4">4 Baby's</option>
</select>
<span class="Text"><em>0&lt; 2jr</em></span> </td>
<td align="right" valign="baseline"><input name='box9' type='text' style="text-align:right;border:0px; background-color:transparent; font-size:16px; color:#164871" size="6" maxlength="10">
&euro;</td>

</tr>

<tr>
<td align="left" valign="baseline"><div style="visibility:hidden; "><input name='box10' type='text' size="6" maxlength="10" />
</div></td>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box11' type='text' size="6" maxlength="10" />
</div></td>
<td align="right" valign="baseline" style=" font-size:16px; color:#164871">Subtotaal 1 </td>
<td align="right" valign="baseline"><input name='box12' type='text' style="text-align:right; border:0px; background-color:transparent; font-size:16px; color:#164871" size="6" maxlength="10"> 
&euro;</td>

</tr>
<tr>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box13' type='text' size="6" maxlength="10" />
</div></td>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box14' type='text' size="6" maxlength="10" />
</div></td>
<td align="right" valign="baseline" style=" font-size:16px; color:#164871"><strong>20%</strong> Vroegboekkorting</td>

<td align="right" valign="baseline"><input name='box15' type='text' style="border:0px; background-color:transparent; text-align:right; font-size:16px; color: #FF0000" size="6" maxlength="10"> 
&euro;</td>
</tr>
<tr>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box16' type='text' size="6" maxlength="10" />
</div></td>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box17' type='text' size="6" maxlength="10" />
</div></td>
<td align="right" valign="baseline" style=" font-size:16px; color:#164871">Subtotaal 2 </td>

<td align="right" valign="baseline"><input name='box18' type='text' style="border:0px; background-color:transparent; text-align:right; font-size:16px; color:#164871" size="6" maxlength="10"> 
&euro;</td>
</tr>
<tr>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box19' type='text' size="6" maxlength="10" />
</div></td>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box20' type='text' size="6" maxlength="10" />
</div></td>
<td align="right" valign="baseline" style=" font-size:16px; color:#164871">Reserveringskosten</td>

<td align="right" valign="baseline"><input name='box21' type='text' 
style="text-align:right; border:0px; background-color:transparent; font-size:16px; color:#164871" size="6" maxlength="10" > 
&euro;</td>
</tr>
<tr>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box22' type='text' size="6" maxlength="10" />
</div></td>
<td align="left" valign="baseline"><div style="visibility:hidden"><input name='box23' type='text' size="6" maxlength="10" />
</div></td>
<td align="right" valign="baseline" style=" font-size:16px; color:#164871"><strong>Eindtotaal</strong></td>

<td align="right" valign="baseline"><input name='box24' type='text' style="border:0px; background-color:transparent; text-align:right; font-size:18px; text-decoration:underline; font-weight:bold; color:#164871" size="7" maxlength="10"> 

&euro;</td>
</tr>
<tr>
<td colspan="4" align="right" valign="baseline"><input type='button' name='uitrekenen' style="font-size:16px; color:#164871" onclick="rekenen1()" value='Bereken eindbedrag!' /> <input type="reset" name="Reset2" style=" font-size:16px; color:#164871" value=" Wissen"/></td>
</tr>

</table>
</form>

.toFixed(2) zorgt ervoor dat de uitvoer wordt afgerond naar twee cijfers achter de komma, maar ook dat 1 als 1.00 wordt weergegeven.

box1 en box4 zijn naar beneden afgerond en box15, de vroegboekkorting, naar boven. Op de cent nauwkeurig, zo voorkom je ook afrondingsfouten bij het optellen.


Vr.Gr. Egel.

 

[kritinet]

GEWELDIG !!!:thumb:
Heb jij misschien ook nog een script dat je een prijs in de linke tabel kan aanklikken dat het automatisch in "box1" verschijnt ???

 

[Egel]

Het toevoegen van de prijs aan het formulier kan met deze functie in het javascript:

function prijs(p) {
 document.rekenen.box1.value = p;
 };

In de prijstabel gebruik je dan zoiets:

<a href="javascript:void(prijs(123))" title="klik om deze prijs in het formulier te gebruiken">123,- €</a><br>
<a href="javascript:void(prijs(234))" title="klik om deze prijs in het formulier te gebruiken">234,- €</a><br>
<a href="javascript:void(prijs(456.78))" title="klik om deze prijs in het formulier te gebruiken">456,78 €</a><br>

Vr.Gr. Egel.

 

[kritinet]

SUPER !!!!! DANK JE WEL:thumb:

 

[Egel]

Graag gedaan!