There are a couple problems here:

First, from [**jsonp explained**][jsonp-explained]:

>As you may be aware **you cannot directly load data files from another domain**. This is a security issue that has been around for a long time and is commonly solved by sharing data through an API, REST or such. **However there are ways around this** ... [for example] JSONP

To do this in jQuery:

* Using [`$.ajax`][$.ajax], add `dataType: 'jsonp'`, which *appends callback=? to the URL*
* Using [`$.getJSON`][getJSON] (*[shorthand for `.ajax`][shorthand]*), add  [`callback=?`][callback=?] at the end of the requested URL.

That indicates that we want to use [`JSONP`][jsonp]. Remove it and a vanilla JSON request will be used; which will fail due to the [same origin policy][same origin policy].


---

Another issue is that some external APIs (like *Google Maps [Directions API][googleMaps]*), don't automatically serve JSONP.  If the server doesn't know what to do with the callback parameter then the response from the API will still be JSON, not JSONP.  In order to ensure the returned content is formatted correctly, you can go through a proxy server like the [jsonp.guffa.com][jsonP Where P stands for proxy]

To use it, change the request to <code>http://jsonp.guffa.com/Proxy.ashx?url=<i>YourEncodedURI</i></code>   
Where you have replaced *YourEncodedURI* with the [encoded][Percent-encoding] requested url string.

---

###Putting it all together:



    var mapsUrl    = 'http://maps.googleapis.com/maps/api/directions/json' + 
                     '?origin=Toronto&destination=Montreal&sensor=false';
    var encodedUrl = encodeURIComponent(mapsUrl);
    var proxyUrl   = 'http://jsonp.guffa.com/Proxy.ashx?url=' + encodedUrl;
    
    $.ajax({
        url: proxyUrl,
        dataType: 'jsonp',
        cache: false,
        success: function (data) {
            console.log(data);
        }
    });


[Working Demo in jsFiddle][jsFiddle]
====

---

Further Reading:

* [What is JSONP all about?][jsonp sample]


[jsonp-explained]: http://www.jquery4u.com/json/jsonp-examples/
[$.ajax]: http://api.jquery.com/jQuery.ajax/
[getJSON]: http://api.jquery.com/jQuery.getJSON/
[shorthand]: http://api.jquery.com/category/ajax/shorthand-methods/
[callback=?]: http://api.jquery.com/jQuery.getJSON/#jsonp
[jsonp]: http://en.wikipedia.org/wiki/JSONP
[same origin policy]: http://en.wikipedia.org/wiki/Same_origin_policy
[googleMaps]: https://developers.google.com/maps/documentation/directions/
[jsonP Where P stands for proxy]: http://jsonp.guffa.com/
[Percent-encoding]: http://en.wikipedia.org/wiki/Percent-encoding
[jsonp sample]: https://stackoverflow.com/a/2067584/1366033
[jsFiddle]: http://jsfiddle.net/KyleMit/bFc4y/

This is the code I was originally using and worked perfectly fine up until yesterday (which is when I noticed it but I am unsure when it actually stopped working for sure).  I know this was working at the beginning of last week so sometime between then and yesterday it broke.  I am running this code within a RAD called Alpha Anywhere but have tested it outside of this program (in just a HTML page) and it still didn't work.  Hoping someone knows if there is a bug or if there is something I can do to fix this issue. I ran this in firefox with firebug on and that is where I saw the error letting me know that the JSON wasn't retrieved.



    var $jq = jQuery.noConflict();
    
    $jq.getJSON('http://maps.googleapis.com/maps/api/directions/json?origin=Toronto&destination=Montreal&sensor=false',function(results){
    
        // I have code in here to calculate miles driven per state 
        // (as in the above code origin and destination would be filled 
        // with variables but I went with this basic call because even this doesn't work).
    
    });


----


This following code does not work (as of right now November 11, 2013 at 10:26 PM CDT) when running it in firefox or chrome.  With firebug on it shows I am not getting a response from google.  However this following code does respond when ran in safari 7.0.x on Mac OSX 10.9.


    <!DOCTYPE html>
    <html>
        <head>
            <script src="http://api.jquery.com/jquery-wp-content/themes/jquery/js/jquery-1.9.1.min.js"></script>
            <script>
                function getData() {
                    var url = 'http://maps.googleapis.com/maps/api/directions/json?origin=Huntsville,AL&destination=Atalanta,GA&sensor=false';
                    var $jq = jQuery.noConflict();
                    $jq.getJSON(url, function (results) {
                        alert(results.routes[0].legs[0].distance.value);
                    });
                }
            </script>
            <title>jQuery Debug of Google API</title>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width">
        </head>
        <body>
            <button onclick="getData();">click</button>
        </body>
    </html>