javascript - jquery .ajax() method fail - Stack Overflow

admin管理员组

文章数量:1333397

Can anyone tell me what might be wrong with this javascript?

        $.ajax({
            cache:false,
            url: '+Amphitheatre+Parkway,+Mountain+View,+CA&sensor=false',
            success: function(data, textStatus, jqXHR) {
                console.log('success');
                console.log(data);
            },
            error: function(jqXHR, textStatus, errorThrown) {
                console.log('error');
                console.log(errorThrown);
                console.log(jqXHR);
            }
        });

The 'error' event handler function is invoked and this is my console output:

error
undefined
XMLHttpRequest { mozResponseArrayBuffer=ArrayBuffer, status=0, more...}

I'm trying to learn how to make ajax calls with jquery, and I'm still pretty new to it.

Can anyone tell me what might be wrong with this javascript?

        $.ajax({
            cache:false,
            url: 'http://maps.googleapis./maps/api/geocode/json?address=1600+Amphitheatre+Parkway,+Mountain+View,+CA&sensor=false',
            success: function(data, textStatus, jqXHR) {
                console.log('success');
                console.log(data);
            },
            error: function(jqXHR, textStatus, errorThrown) {
                console.log('error');
                console.log(errorThrown);
                console.log(jqXHR);
            }
        });

The 'error' event handler function is invoked and this is my console output:

error
undefined
XMLHttpRequest { mozResponseArrayBuffer=ArrayBuffer, status=0, more...}

I'm trying to learn how to make ajax calls with jquery, and I'm still pretty new to it.

• javascript
• jquery

Share Improve this question Follow asked May 10, 2011 at 16:55 Casey FlynnCasey Flynn 14k2626 gold badges108108 silver badges196196 bronze badges 4

• Have you tried another URL? Like try putting a local file and asking for that. What does Chrome say? And are you trying to do this locally or on a server? (By locally I mean the file:// protocol) – Oscar Godson Commented May 10, 2011 at 17:00
• What is 'textStatus' when you get into the Error block ? – Russ Clarke Commented May 10, 2011 at 17:02
• Try adding dataType: 'json' in your ajax... I'm not sure if that'll help but it might :P – Shaded Commented May 10, 2011 at 17:04
• 1 You can't make cross-domain ajax requests without some extra work - you must either use JSONP or the server must allow cross domain requests by way of access-control headers. See my answer for more details and some links. – no.good.at.coding Commented May 10, 2011 at 23:32

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

I think you're doing a Cross domain request, which is blocked by your browser.

You could directly use the Maps API, which has convenient methods for such things.

Maps Documentation

function codeAddress() {
  var address = document.getElementById("address").value;
  geocoder.geocode( { 'address': address}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      map.setCenter(results[0].geometry.location);
      var marker = new google.maps.Marker({
        map: map,
        position: results[0].geometry.location
      });
    } else {
      alert("Geocode was not successful for the following reason: " + status);
    }
  });
} 

I've just run this block of code through JSFiddle and get the same error problem.

however, when I go directly to the request URL I get this block of JSON:

{
  "status": "REQUEST_DENIED",
  "results": [ ]
}

Are you getting the same ?

• The first problem is that you can't make cross-domain Ajax requests without some extra work - you must use JSONP and not just 'plain' JSON or the server must allow the CDR via the appropriate access-control headers^[ref].

• However, the bigger problem here is that with v3 of the API, Google has taken away the ability to make JSONP requests (or at least it is undocumented at the moment). They would prefer you to use the Google Maps library geocoder instead:

  var geocoder = new google.maps.Geocoder();
  geocoder.geocode({
                  'address': '1600+Amphitheatre+Parkway,+Mountain+View'
                   },
  
                   function(data, status){
                        console.log(data); //data is an array of results
                   });
  

---

For the moment, you could fall back to the v2 API if you absolutely must have Ajax geocoding but don't want to use the geocoder built into the Google Maps JS library:

$.ajax({
    cache: false,

    url: 'http://maps.google./maps/geo?q=1600+Amphitheatre+Parkway,+Mountain+View,+CA&output=json&sensor=false&key=<your_key_here>',

    success: function(data, textStatus, jqXHR) {
        console.log('success');
        console.log(data); //geocoded data
    },

    error: function(jqXHR, textStatus, errorThrown) {
        console.log(textStatus);
        console.log(errorThrown);
        console.log(jqXHR);
    },

    jsonp: 'callback',

    dataType: 'json'
});

本文标签： javascriptjquery ajax() method failStack Overflow