Wywołanie ajax nie działa, gdy używany jest przycisk przesyłania

Próbuję pobrać kurs walutowy na żywo za pomocą następującego interfejsu API.

"http://www.exchangerate-api.com/INR/USD/1?k=FQRxs-xT2tk-NExQj"

Kiedy klikam przycisk, ostrzega o kursie i działa dobrze. Używam następującego kodu Ajax.

<script type="text/javascript" language="javascript">
    function testCurrencyRate()
    {
        $.ajax({
                datatype:"html",
                type: "GET",
                url: "ajax/LiveCurrencyRate.php",
                data: "t="+new Date().getTime(),
                success: function(response)
                {       
                    alert(response);                    
                },
                error: function(e)
                {
                    alert('Error while fetchig the live currency rate.');                       
                }
            }); 
    }
</script>

Żądanie Ajax trafia doLiveCurrencyRate.php strona, która jest następująca.

$url="http://www.exchangerate-api.com/INR/USD/1?k=FQRxs-xT2tk-NExQj";               
$result = file_get_contents($url);
echo $result;   

i<form></form> który zawiera jedyny przycisk, który po kliknięciu tworzy żądanie Ajax na tym adresie URLajax/LiveCurrencyRate.php.

<form id="testForm" name="testForm" action="" method="post">    
    <input type="submit" id="btnTestCurrencyRate" name="btnTestCurrencyRate" value="Test" onclick="testCurrencyRate();"/>
</form>

Wszystko w porządku. Problem pojawia się jednak, gdy zmieniam typ przyciskutype="button" dotype="submit", to nie działa. Pole alertu w części błędu funkcji Ajaxpokazuje okno alertu na chwilę i nagle znika. Nie mogę znaleźć żadnej rozsądnej przyczyny, która mogłaby uniemożliwić wypełnienie tego żądania. To samo działało dla mnie w moim poprzednim projekcie, ale używałemXMLHttpRequest do tworzenia żądań Ajax. Co tu jest nie tak?

questionAnswers(4)

yourAnswerToTheQuestion