Cannot get info from error when trying to get JSON data via JQuery,

For the life of me i can't figure out why i keep getting an error when making an AJAX request using the bit of bode below. When the page load, and the alerts pop up absolutely no useful information as to why the request failed, the response code is 200 in firebug, readyState, and status are both 0 when the pop up, and responseText is empty. I can access the request using the browser just fine. I just goes to the error callback function:

<script src="/static/js/jquery-1.6.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {

    function loadData(url, container) {
        var data =[];

        $.ajax({
            url: url,
            dataType: 'json',
            data开发者_开发技巧: data,
            success: function(data) {
                var obj = jQuery.parseJSON(data,container);
                alert(container);   
            },
            error: function(xhr,err) {
                alert("readyState: "+xhr.readyState+"\nstatus: "+xhr.status);
                alert("responseText: "+xhr.responseText);

            }
        });
    };

    loadData( 'http://api.giantbomb.com/genres/?api_key=####&format=json', '#genres-pane');

});


</script>

thank you in advance

It looks like you are trying to do a cross-domain request as JSON, which means using XmlHttpRequest in the backend. This is disallowed due to the same origin policy. Try changing your data type to "jsonp". You'll also need to change your url's format argument from "json" to "jsonp".

FireBug for firefox will show you all requests, posts, responses, etc. Very useful for this kind of stuff.