如何让这个javascript函数自动运行？

Question

I am trying to use a longitude/latitude converter to display the OSGR value. This is the code I have at the moment:

    <?php

$longitude = "-0.310150 N";
$latitude = "59.688930 W";
?>

<script language="JavaScript" type="text/JavaScript">
<onload = function() {
           CalculateOSGB();
         };
</script>

<script language="JavaScript" type="text/JavaScript">
function ELMNT(elementName)
{
  return document.getElementById(elementName);
}

function CalculateLL()
{
  ENEN = new EastNorth;
  RefToCoords ( ELMNT("OSRef").value, ENEN );

//  ELMNT("OSRef").value = ELMNT("OSRef").value + ENEN.Easting + " " + ENEN.Northing + "\t";
  CoordsToLL(ENEN,LatLong);

  ELMNT("latitude").value = LatLong.Lat;
  ELMNT("longitude").value = LatLong.Long;
//  ELMNT("OSRef").value = ELMNT("OSRef").value + LatLong.Lat + "\t" + LatLong.Long + "\t" + ELMNT("OSRef").value + "
";
}

function RefToCoords ( InRef, EastNorth )
{
    var  Length1 = 0;
    var  Length2 = 0;
    var  Index;
    Numbers  = new String("");
    Letters  = new String("");
    Easting  = new Array("");
    Northing = new Array("");
    Grid_X = new Array(   0, 100, 200, 300, 400,   0, 100, 200,   0, 300, 400,   0, 100, 200, 300, 400,   0, 100, 200, 300, 400,  0, 100, 200, 300, 400, 0);
    Grid_Y = new Array( 400, 400, 400, 400, 400, 300, 300, 300,   0, 300, 300, 200, 200, 200, 200, 200, 100, 100, 100, 100, 100,  0,   0,   0,   0,   0, 0);
    Lookup = new String("                                                                 ABCDEFGHIJKLMNOPQRSTUVWXYZ");

    Ref = new String(InRef);
    Ref.toUpperCase();

    Length1 = Ref.length;
    for ( i=0; i<Length1; i++ )
    {
        if ( Ref.charAt(i).toUpperCase() >= 'A' && Ref.charAt(i).toUpperCase() <= 'Z' )
            Letters = Letters + Ref.charAt(i).toUpperCase();
        else
            if ( Ref.charAt(i) >= '0' && Ref.charAt(i) <= '9' )
                Numbers = Numbers + Ref.charAt(i);
    }

    if ( Letters.length != 2 )
    {
        ELMNT("OSRef").value = ELMNT("OSRef").value + "ERROR: OS Ref. Letters must be 2 long
";
        return -1;
    }

    Length2 = Numbers.length;
    if ( !Length2 || Length2 & 0x01 )
    {
        ELMNT("OSRef").value = ELMNT("OSRef").value + "ERROR: OS Ref. Must not be odd number of numbers
";
        return -1;
    }

    Length2 = Length2 / 2;
    Length2 = Math.floor(Length2)

    Easting = Numbers.slice(0,Length2);
    Easting = Easting + "00000";

    Northing = Numbers.slice(5,5+Length2);
    Northing = Northing + "00000";

    Index = Lookup.indexOf(Letters.charAt(0)) - 65;
    EastNorth.Easting = 5000 * Grid_X[Index];
    EastNorth.Northing = 5000 * Grid_Y[Index];

    Easting= Easting /100000;
    Northing = Northing / 100000;
    Index = Lookup.indexOf(Letters.charAt(1)) - 65;
    EastNorth.Easting = EastNorth.Easting + ( Grid_X[Index] * 1000 );
    EastNorth.Northing = EastNorth.Northing + ( Grid_Y[Index] * 1000 );

    EastNorth.Easting = EastNorth.Easting + ( parseInt(Easting) - 1000000 );
    EastNorth.Northing = EastNorth.Northing + ( parseInt(Northing) - 500000 );

    return 0;
}

function LLToCoords(LatLong,EastNorth)
{
  var dLongI = 0.0; 
  var dLatI  = 0.0;
  var Rad    = 0.0174532925199432957692369076848;

  dLongI = Rad * (parseFloat ( LatLong.Long )+2.0 );
  dLatI  = parseFloat ( LatLong.Lat ) * Rad;

  dT     = Math.tan ( dLatI );
  dTSq   = dT * dT;
  dJ     = dLongI * Math.cos ( dLatI );
  dJSq   = dJ * dJ;
  dETASq = Math.cos ( dLatI );
  dETASq = dETASq * dETASq * 0.0067153346685;

  dNu = Math.sin ( dLatI );
  dNu = 6377563.396 / Math.sqrt ( 1.0 - ( dNu * dNu * 0.006670539761597 ) );  

  dA7 = ( 61.0 - dTSq * ( 479.0 - 179.0 * dTSq + dTSq * dTSq ) ) /5040.0;
  dA5 = ( 5.0 - dTSq * ( 18.0 - dTSq ) + dETASq * ( 14.0 - 58.0 * dTSq ) ) / 120.0;
  dA3 = ( 1.0 - dTSq + dETASq ) / 6.0;
  dA1 = 0.9996012717 * dNu;

  EastNorth.Easting = dA1 * dJ * ( 1.0 + ( dJSq * ( dA3 + ( dJSq * ( dA5 + dA7 * dJSq ) ) ) ) );

  dM=6335021.60578487*(1.0050342114*dLatI-0.5*0.0050449242*Math.sin(2.0*dLatI)+0.25*0.0000105505*Math.sin(4.0*dLatI));
  dA2 = 0.5 * dA1 * dT;
  dA4 = ( 5 - dTSq + dETASq*(9.0+4.0*dETASq) ) / 12.0;
  dA6 = ( 61.0 - dTSq*(58.0+dTSq) + dETASq*(270.0-330.0*dTSq) ) / 360.0;

  EastNorth.Northing = 0.9996012717 * dM + dA2 * dJSq * ( 1.0 + dJSq * ( dA4 + dA6 * dJSq ) );

  EastNorth.Easting  = EastNorth.Easting + 400000;
  EastNorth.Northing = EastNorth.Northing - 5527063.0;

  return dLongI;
}

function EastNorth(East,North)
{
  this.Easting = East;
  this.Northing = North;
  return 0;
}

function LatLong(Lat,Long)
{
  this.Lat = Lat;
  this.Long = Long;
  return 0;
}

function CoordsToLL(InEastNorth,InLatLong)
{
  var Rad = 0.0174532925199432957692369076848;
  var K = 1 / (  Rad * 6377563.396 );
  var dx;
  var dy;
  var myloop = 0;

  EN = new EastNorth(InEastNorth.Easting,InEastNorth.Northing);
  LL = new LatLong(52.0,-3.0);
  do
  {
    myloop = myloop + 1;
    LLToCoords(LL,EN);
    dx = InEastNorth.Easting - EN.Easting;
    dy = InEastNorth.Northing - EN.Northing;
    LL.Lat = LL.Lat + dy * K;
    LL.Long = LL.Long + dx * K / ( Math.cos(Rad) * LL.Lat );
  } while ( ( ( (Math.abs ( dx ) + Math.abs ( dy )) > 0.0000001 )) && myloop < 5000);
  InLatLong.Lat = LL.Lat;
  InLatLong.Long = LL.Long;

  return 0;
}


function CalculateOSGB()
{

  var lat = "<?php echo $latitude; ?>";
  var lon = "<?php echo $longitude; ?>";
  LatLong.Lat  = (lat);
  LatLong.Long = (lon);
  LLToCoords ( LatLong, EastNorth );
  ELMNT("OSRef").value = OSReference ( EastNorth );

}


function OSReference(EastNorth)
{
  var Codes = new Array ( 'V','W','X','Y','Z','Q','R','S','T','U','L','M','N','O','P','F','G','H','J','K','A','B','C','D','E');
  var East = 0.0;
  var North = 0.0;
  var I = 0;
  var J = 0;
  var A = ' ';
  var B = ' ';

  East  = parseInt ( EastNorth.Easting ) + 1000000.0;
  North = parseInt ( EastNorth.Northing ) + 500000.0;

  I = parseInt ( East  / 500000 );
  J = parseInt ( North / 500000 );
  A = Codes[parseInt ( I + J*5 )];

  East  = parseInt (  East % 500000 );
  North = parseInt ( North % 500000 );
  I = parseInt ( parseInt ( East  ) / 100000 );
  J = parseInt ( parseInt ( North ) / 100000 );
  B = Codes[parseInt ( I + J*5 )];

  C = (parseFloat(East)+100000)+"";
  D = (parseFloat(North)+400000)+"";

  return A + B + ' ' + C.substring(C.length-5,6) + ' ' + D.substring(D.length-5,6);
}
</script>


<div id="Layer3" style="position:absolute; width:695px; height:115px; z-index:1; left: 189px; top: 115px;"> 
  <table align="center" border="0">
    <tbody><tr> 
      <td><font face="Arial, Helvetica, sans-serif">Latitude:</font></td>
      <td><font face="Arial, Helvetica, sans-serif"> 
        <input value="" id="latitude" name="latitude" size="30" type="text">
        </font></td>
      <td><font face="Arial, Helvetica, sans-serif">6° South should be entered 
        as -6.0</font></td>
    </tr>
    <tr> 
      <td><font face="Arial, Helvetica, sans-serif">Longitude:</font></td>
      <td><font face="Arial, Helvetica, sans-serif"> 
        <input value="" id="longitude" name="longitude" size="30" type="text">
        </font></td>
      <td><font face="Arial, Helvetica, sans-serif">4° West should be entered 
        as -4.0</font></td>
    </tr>
    <tr> 
      <td></td>
      <td> <font face="Arial, Helvetica, sans-serif"> 
        <input value="Convert Lat/Long to OSGB" onclick="CalculateOSGB()" name="LL2OSGB" type="button">
        </font></td>
      <td> <font face="Arial, Helvetica, sans-serif"> 
        <input value="Convert OSGB to Lat/Long" onclick="CalculateLL()" name="OSGB2LL" type="button">
        </font></td>
    </tr>
    <tr> 
      <td><font face="Arial, Helvetica, sans-serif">OS Ref.</font></td>
      <td colspan="2"><font face="Arial, Helvetica, sans-serif"> 
        <input value="" id="OSRef" name="OSRef" size="30" type="text">
        </font></td>
    </tr>
    <tr> 
      <td></td>
      <td colspan="2"><font face="Arial, Helvetica, sans-serif">If you see 'NaN' 
        your Lat/Long is out of range for an OSGB reference</font></td>
    </tr>
  </tbody></table>
  <div id="results" style="position:absolute; width:695px; height:50;"></div>
</div>

I don't know javascript very well, but I believe the calculateOSGB() function works out the OSGR after the calculate button is clicked. Could someone please explain how I would get this to work automatically rather than having to click the button? I would like to be able to insert the longitude & latitude from a database (why I have used PHP variables) and have this script automatically display & output the OSGR value.

Thanks for any help

Answer 1

if you don't use a JS library like jQuery, you can use onload

onload = function() {
           // do something here
         };

and that's it. Some people like to use window.onload but it is the same thing.

Reference:
https://developer.mozilla.org/en/DOM/window.onload
Best practice for using window.onload

If you consider using jQuery or some other library, it may save you time over the long run. If using jQuery, you can use

$(function() {   
  // do something
});

and it will run when the DOM is ready, which is earlier than when the page is fully loaded like the first method above.