javascript - 未定义不是 Jquery 脚本中的函数

Question

我在使用一些 javascript 时遇到了问题，我得到了帮助。这是我得到的错误:

Uncaught TypeError: undefined is not a function 

好像和我的台词是一样的:

callback(lastResult); // send the result back

奇怪的是代码似乎按预期工作，但我显然不希望我的代码出现错误。有人可以帮我看看我哪里出错了吗？

Jsfiddle: http://jsfiddle.net/spadez/uaZkV/3/

完整代码:

$(function () {
    var input = $("#loc"),
        lat = $("#lat"),
        lng = $("#lng"),
        lastQuery = null,
        lastResult = null, // new!
        autocomplete;

    function processLocation(callback) { // accept a callback argument
        var query = $.trim(input.val()),
            geocoder;

        // if query is empty or the same as last time...
        if (!query || query == lastQuery) {
            callback(lastResult); // send the same result as before
            return; // and stop here
        }

        lastQuery = query; // store for next time

        geocoder = new google.maps.Geocoder();
        geocoder.geocode({
            address: query
        }, function (results, status) {
            if (status === google.maps.GeocoderStatus.OK) {
                lat.val(results[0].geometry.location.lat());
                lng.val(results[0].geometry.location.lng());
                lastResult = true; // success!
            } else {
                alert("Sorry - We couldn't find this location. Please try an alternative");
                lastResult = false; // failure!
            }
            callback(lastResult); // send the result back
        });
    }

    autocomplete = new google.maps.places.Autocomplete(input[0], {
        types: ["geocode"],
        componentRestrictions: {
            country: "uk"
        }
    });

    google.maps.event.addListener(autocomplete, 'place_changed', processLocation);

    $('#searchform').on('submit', function (event) {
        var form = this;

        event.preventDefault(); // stop the submission

        processLocation(function (success) {
            if (success) { // if the geocoding succeeded, submit the form
                form.submit()
            }
        });

    });
});

Answer 1

google.maps.event.addListener(autocomplete, 'place_changed', processLocation);

如果您将 processLocation 添加为 map 事件监听器，则事件触发时将不会传递任何参数。 callback 参数是 undefined 然后导致你的异常(虽然没有停止你的控制流，因为它是最后一条语句)。

这意味着您将在调用它之前检查是否传递了实际的 callback 函数:

function processLocation(callback) { // accept a callback argument
    var query = $.trim(input.val()),
        geocoder;

    // if query is empty or the same as last time...
    if (!query || query == lastQuery) {
        if (typeof callback=="function")
            callback(lastResult); // send the same result as before
        return; // and stop here
    }

    lastQuery = query; // store for next time

    geocoder = new google.maps.Geocoder();
    geocoder.geocode({
        address: query
    }, function (results, status) {
        lastResult = status === google.maps.GeocoderStatus.OK;
        if (lastResult) {
            lat.val(results[0].geometry.location.lat());
            lng.val(results[0].geometry.location.lng());
        } else {
            alert("Sorry - We couldn't find this location. Please try an alternative");
        }
        if (typeof callback=="function")
            callback(lastResult); // send the result back
    });
}

如果你多次调用callback并且不想在任何地方执行类型检查，你也可以定义一个

function noOperation() {}

如果没有传递，则将其用作 callback 的默认值:

function processLocation(callback) { // accept a callback argument
    if (typeof callback != "function")
        callback = jQuery.noop; // predefined by jQuery
    …
}