如何让函数运行,然后等待用户输入,然后另一个函数运行?

时间:2016-09-08 11:22:26

标签: javascript jquery google-maps-api-3

我在弄清楚如何使函数运行时遇到问题 - 然后等待用户输入(I.E:如果用户选择共享位置),然后运行另一个函数。当“getUserLocation”函数运行时,“addLocationArrayToMap”函数在用户有机会在警报窗口上进行任何输入之前运行。

有些调试返回“userPos未定义”,这让我觉得我猜它为什么不起作用是准确的。?

以下代码:

var markers =[];
var myLocationIconArray = [];
var infoWindowContentString = '';
var addInfowindow;
var distanceArray = [];
var addInfowindow;

function runAll() {
    getUserLocation(addLocationArrayToMap);
}

function getUserLocation() {    
    map.setOptions({draggable: true, zoomControl: true, scrollwheel: true, disableDoubleClickZoom: false});

// Another function that deletes 'dummy' markers before adding Real Markers to the map
    deleteMarkers();

    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function(position) {
            centerPos = {
                lat: position.coords.latitude,
                lng: position.coords.longitude
            };
            map.setCenter(centerPos);
            addMarker(centerPos);
        }, function() {
            handleLocationError(true, map.getCenter());
        });
    } else {
        //Browser doesn't support Geolocation
        handleLocationError(false, map.getCenter());
    }
}

function handleLocationError(browserHasGeolocation, defaultPos) {
    infoWindowContentString = "Sorry, we can't get your location.";
    addInfowindow = new google.maps.InfoWindow({
          content: infoWindowContentString
        });
    map.setCenter(defaultPos);
    addMarker(defaultPos, addInfowindow);
}


function addMarker(location, addInfowindow) {
    var marker = new google.maps.Marker({
        position: location,
        map: map,
        animation: google.maps.Animation.DROP,
        icon: yourLocation,
        draggable: false,
        clickable: true
    });
    if (addInfowindow == null) {
        var myLocationInfowindow = new google.maps.InfoWindow({
          content: "Your location"
        });
        myLocationInfowindow.open(map, marker);
        myLocationIconArray.push(marker);
    } else {
        myLocationIconArray.push(marker);
    }
}


function addLocationArrayToMap() {
    userPos =  new google.maps.LatLng(centerPos.lat, centerPos.lng);

    for (var z = 0; z < dabblersArray.length; z++) {    
// dabblersArray is an array of Lat & Lng coords.
        dabblerLocation = new google.maps.LatLng(dabblersArray[z].lat, dabblersArray[z].lng);
        calculateDistance(userPos, dabblerLocation);

        markers.push(new google.maps.Marker({
        position: dabblersArray[z],
            map: map,
            icon: dabblers,
            draggable: false,
            clickable: true
        }));
// Some logic to add the distance from the user and the dabblersArray as an alert window above each marker - haven't done this yet. 
    }
}

function calculateDistance(userPos, dabblerLocation) {
    distance = google.maps.geometry.spherical.computeDistanceBetween(userPos, dabblerLocation);
    distanceArray.push(distance);
}

1 个答案:

答案 0 :(得分:1)

JavaScript没有让用户等待的概念。实现此目的的方法是使用回调,就像navigator.geolocation.getCurrentPosition举例说明的那样。它有成功和错误回调,您已经在使用它。

您已经将addLocationArrayToMap传递给getUserLocation,但未使用它。它应该作为navigator.geolocation.getCurrentPosition成功处理程序中的回调函数调用。完成任务。

function runAll() {
    getUserLocation(addLocationArrayToMap);
}

function getUserLocation(onComplete) {    
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function(position) {
            //Your logic...

            //Invoke callback 
            onComplete();
        }, function() {
            handleLocationError(true, map.getCenter());
        });
    }
}