Google Distance Matrix API Does Not Work in HTML DOM

Google Distance Matrix API Does Not Work in HTML DOM

Hi all, my name is John and I'm new to this, I tried to make this work, but I think the JSON does not work at all. The API key is legit, but I'm not getting any response.

Thx.


<!DOCTYPE html>

<html>

<title>

test distance

</title>

 

<head>

<script src="https://code.jquery.com/jquery-1.11.3.js"></script>

</head>

<body>

<script>

  

    $(document).on('pageinit', function () {

 

function findDistance() {

 

var pointa='267 Reservation Rd, Marina, CA 93933';

var pointb='1 Old Fishermans Wharf, Monterey, CA 93940';

var strAPIKey = '&KEY=AIzaSyDzfmx2UOQmy5WKoXUyCh2Vk9JxS8ixzq0';  

   

var strURL = 'https://maps.googleapis.com/maps/api/distancematrix/json?units=imperial&origins=' + pointa+','+'&destinations='+ pointb + strAPIkey;

    $.ajax({

        url: strURL,

        success: function (data) {

            var intDistance = data.results[0].distance;

            alert (intDistance);       

        }

    });

}

 

findDistance();

 

  });

</script>

</body>

</html>