Passing a variable from a callback function to another function?

问题

I am working on setting up an HTML5 GeoLocation script and I would like to store the zip code in a cookie but for now I am just trying to figure out how to pass the zip code variable into another function.

Here is my script to reverse geo-code based on lat/long:

function retrieve_zip(callback)
{
    try { if(!google) { google = 0; } } catch(err) { google = 0; } // Stupid Exceptions
    if(navigator.geolocation) // FireFox/HTML5 GeoLocation
    {
        navigator.geolocation.getCurrentPosition(function(position)
        {
            zip_from_latlng(position.coords.latitude,position.coords.longitude,callback);
        });
    }
    else if(google && google.gears) // Google Gears GeoLocation
    {
        var geloc = google.gears.factory.create('beta.geolocation');
        geloc.getPermission();
        geloc.getCurrentPosition(function(position)
        {
            zip_from_latlng(position.latitude,position.longitude,callback);
        },function(err){});
    }
}
function zip_from_latlng(latitude,longitude,callback)
{
    // Setup the Script using Geonames.org's WebService
        var script = document.createElement("script");
        script.src = "http://ws.geonames.org/findNearbyPostalCodesJSON?lat=" + latitude + "&lng=" + longitude + "&callback=" + callback;
        console.log(script.src);
    // Run the Script
        document.getElementsByTagName("head")[0].appendChild(script);
}
function callback(json)
{
    zip = json.postalCodes[0].postalCode;
    country = json.postalCodes[0].countryCode;
    state = json.postalCodes[0].adminName1;
    county = json.postalCodes[0].adminName2;
    place = json.postalCodes[0].placeName;
    alert(zip);
}
$('#findLocation').click(function(event) {
    event.preventDefault();
    console.log(zip); // This is giving me undefined currently
});

So basically, in the callback function, I want to store the zip code as a variable(rather than displaying it in an alert) and then in the on click function at the bottom, I want to be able to display the zip code that was stored in the previous callback function.

Any help greatly appreciated, still pretty new to Javscript/jQuery, thanks!

回答1:

You could set zip as a 'global' variable by including it outside of the function at the top of the document like so:

var zip;
...

Alternatively, you may consider defining an object at the 'global' level and using it as a namespace to store variables like so:

window.address = {};

function callback(json){
    address.zip = json.postalCodes[0].postalCode;
    address.country = json.postalCodes[0].countryCode;
    address.state = json.postalCodes[0].adminName1;
    address.county = json.postalCodes[0].adminName2;
    address.place = json.postalCodes[0].placeName;
}

$('#findLocation').click(function(event) {
    event.preventDefault();

    console.log(address.address);
    console.log(address.zip);
    ...
});

I hope this helps!

回答2:

Define var zip at very begining of code. You haven't defined it.

I haven't tried, but it should solve your problem.

Also, it seems that you forgot to define other variables in callback function as well.

回答3:

What I would do, is to avoid the anonymous function in the event handler, that is, create a new named function -which gives you the added benefit of traceability during debugging- and then use that function as the event handler callback:

function eventHandlerFunction(event) {
  var zip;
  event.preventDefault();

  zip = eventHandlerFunction.zip;
  console.log(zip);
}

function callback(json) {
  var zip;
  zip = doSomethingWithJsonToGetTheZip();
  eventHandlerFunction.zip = zip;
}

$("#findLocation").click(eventHandlerFunction);

Or, better yet, code this as a module and then you have member encapsulation and you can share variables amongst functions without modifying the global object. You never know when another library will modify the same global member that you are using.

   var yourModule = (function($) {
      var zip;

      function retrieveZip(callback) {
        // your code
      }

      function callback(json) {
        // do something with json
        zip = json.zip; // or whatever
      }

      $("#findLocation").click(function(event) {
         event.preventDefault();
         console.log(zip);  // zip is visible in the parent scope + this scope
      });
   }(jQuery));

来源：https://stackoverflow.com/questions/23398322/passing-a-variable-from-a-callback-function-to-another-function

标签

javascript

jquery

function

variables