Javascript refreshing page, I can't tell why
<p>I'm a newbie to javascript (or web development of any sort, really), and having trouble tracking down a bug. Basically pressing the "Route (desktop version)" button <a href="http://domuirgheasa.com/testdirectory/GoFuel.html" rel="nofollow">here</a> should trigger a function, calcRoutePartOne(), which it does. </p>

<pre><code>function calcRoutePartOne()
    {
        alert("calcRoutePartOne");
        shortestTimeIndex = "undefined";
        lowestTotalCost = "undefined";
        shortestDistanceIndex = "undefined";
        shortestDistance = "undefined";
        alert("Alert B");
        displayLoadingImage();
        alert("Alert C");
        var startText = document.getElementById("start").value;
        alert(startText);
        geocoder.geocode( 
        { 
            'address':startText
        }, 
        function(results, status)
        {
            if (status == google.maps.GeocoderStatus.OK)
            {
                start = results[0].geometry.location;
                alert(start);
                calcRoutePartTwo();
            }
            else
            {
                alert("Failed to geocode start address \n Error: " + status);
                hideLoadingImage();
            }
        });
    }
</code></pre>

<p>This function executes fine for me, all the alerts firing off as they should, but then instead of calling calcRoutePartTwo() the page just refreshes [<strong>edit:</strong> Now it's sometimes getting to calcRoutePartTwo and THEN refreshing, which is also not what it should be doing].</p>

<p>Particularly puzzling is that I've had this code working before - at the moment I'm just refactoring, and working on the UI, so I don't understand how this has suddenly started happening.</p>

<p>The code I'm having a problem with I have available <a href="http://domuirgheasa.com/testdirectory/GoFuel.html" rel="nofollow">here</a>. I also have the previously working code, which is practically identical apart from the UI, <a href="http://domuirgheasa.com/SOFA.html" rel="nofollow">here</a></p>

<p>The problem has only started since I started using jquery, so I wonder is there some error in jquery which causes this behaviour? The page shouldn't refresh at all, at any point - as the code stands, it should redirect to google after reaching the end </p>

<p>Thanks.</p>

<p><strong>EDIT</strong>: This is the possibly-offending function:</p>

<pre><code>function calcRoutePartTwo()
    {
        alert("calcRoutePartTwo");
        var endText = document.getElementById("end").value;
        geocoder.geocode( 
        { 
            address: endText
        }, 
        function(results, status)
        {
            if (status == google.maps.GeocoderStatus.OK)
            {
                end = results[0].geometry.location;
                console.log(end);
                calcRoutePartThree();
            }
            else
            {
                alert("Failed to geocode end address \n Error: " + status);
                hideLoadingImage();
            }
        });
    }
</code></pre>

<p>Or the problem could, I guess, be almost anywhere else on the page either. I just have no idea.</p>
