0

Hi I am trying to use the code below more than once within a web page. I have tried changing the id's of the div, getElementid and outDiv, however only one of the scripts will work. Is the outDIV.innerHTML the problem.

Inline Code Example Here

<link rel="stylesheet" type="text/css">

<style>

div
{
  text-align: right;
  padding: 1px;
  margin: 1px;
  color: #006666;
  font-family: arial;
  font-size:28pt;
  font-weight:700;
  background-color:
  } 

</style> 
<script type="text/javascript">

function calculate()

{

A = document.getElementById('input').value;

outDiv = document.getElementById('output');

B =(parseInt(A) * 1.0);

//alert(A);

D = (parseInt(B) * 1.0 );

if ( B <= 19)

{

tax = 0.00;

}

else if (B <= 30)

{

tax = (B * 3.95) * 1;

}

else if (B <= 40)

{

tax = (B * 3.75) * 1;

}

else if (B <= 50)

{

tax = (B * 3.70) * 1;

}

else if (B <= 60)

{

tax = (B * 3.55) * 1;

}

else if (B <= 70)

{

tax = (B * 3.40) * 1;

}

else if (B <= 80)

{

tax = (B * 3.25) * 1;

}

else if (B <= 90)

{

tax = (B * 3.10) * 1;

}

else if (B <= 100)

{

tax = (B * 2.95) * 1;

}

else if (B <= 150)

{

tax = (B * 2.80) * 1;

}

else if (B <= 200)

{

tax = (B * 2.65) * 1;

}

else

{

tax = (B * 2.60) * 1;

}

outDiv.innerHTML = '£'+tax;

}

</script>

</HEAD>

<BODY>
<p style="margin-left: 3">
<i><font face="Arial" color="#006666" style="font-size: 9pt">Enter Quantity (sq m)</font></i>
<INPUT id='input' NAME="text2" size="1" value="20"maxlength="3" />

<INPUT TYPE="button" VALUE="submit" onClick="calculate()" 
style="color: #006666; font-family: Arial; font-size: 10px; position:relative; width:100; height:25"/></p>

<div id='output' style="width: 0; height: -1"> </div>

</BODY>
</HTML>

</code></p>

</body>

</font>

</html>Heading Here

Heading Here #
`

2
Contributors
2
Replies
3
Views
4 Years
Discussion Span
Last Post by mattsearle
0

I didn't understand much of what your problem is. But is something like this that you want?

<!DOCTYPE html>
<html>

<head>

<link rel="stylesheet" type="text/css">

<style>

div
{
  text-align: right;
  padding: 1px;
  margin: 1px;
  color: #006666;
  font-family: arial;
  font-size:28pt;
  font-weight:700;
  background-color:
  } 

</style> 
<script type="text/javascript">

function calculate(inputId, outputId)

{

A = document.getElementById(inputId).value;

outDiv = document.getElementById(outputId);

B =(parseInt(A) * 1.0);

//alert(A);

D = (parseInt(B) * 1.0 );

if ( B <= 19)

{

tax = 0.00;

}

else if (B <= 30)

{

tax = (B * 3.95) * 1;

}

else if (B <= 40)

{

tax = (B * 3.75) * 1;

}

else if (B <= 50)

{

tax = (B * 3.70) * 1;

}

else if (B <= 60)

{

tax = (B * 3.55) * 1;

}

else if (B <= 70)

{

tax = (B * 3.40) * 1;

}

else if (B <= 80)

{

tax = (B * 3.25) * 1;

}

else if (B <= 90)

{

tax = (B * 3.10) * 1;

}

else if (B <= 100)

{

tax = (B * 2.95) * 1;

}

else if (B <= 150)

{

tax = (B * 2.80) * 1;

}

else if (B <= 200)

{

tax = (B * 2.65) * 1;

}

else

{

tax = (B * 2.60) * 1;

}

outDiv.innerHTML = '£'+tax;

}

</script>

</head>

<BODY>
<p style="margin-left: 3">
<i><font face="Arial" color="#006666" style="font-size: 9pt">Enter Quantity (sq m)</font></i>
<INPUT id='inputA' NAME="text2" size="1" value="20"maxlength="3" />

<INPUT TYPE="button" VALUE="submit" onClick="calculate('inputA', 'outputA')"  
style="color: #006666; font-family: Arial; font-size: 10px; position:relative; width:100; height:25"/></p>

<div id='outputA' style="width: 0; height: -1"> </div>

<p style="margin-left: 3">
<i><font face="Arial" color="#006666" style="font-size: 9pt">Enter Quantity (sq m)</font></i>
<INPUT id='inputB' NAME="text2" size="1" value="20"maxlength="3" />

<INPUT TYPE="button" VALUE="submit" onClick="calculate('inputB', 'outputB')"  
style="color: #006666; font-family: Arial; font-size: 10px; position:relative; width:100; height:25"/></p>

<div id='outputB' style="width: 0; height: -1"> </div>


</BODY>
</HTML>

</code></p>

</body>

</font>

</html>
This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.