jquery - 让 gps 脚本运行一次，不需要停止和启动按钮

Question

我是新来的，所以要友善。 我希望这个 gps 跟踪器在加载页面“gps.php”时自动将一个条目写入我的 mysql 数据库 如果你按下开始按钮，然后按下停止按钮，我就可以正常工作了。 我想完全摆脱按钮，只让这个 jquery 脚本运行一次并向 mysql 表输入一次注入(inject)。

所有代码都在这里http://cdpn.io/qkEvA

你能不能请你帮忙，我已经苦苦挣扎了几个星期(我不是职业程序员；)

$(document).ready(function() {

// how often should we send location data? in seconds
var sendInterval = 0.9;

var runnerId;
while (!runnerId){
    runnerId = prompt("Enter your album name:", "");
}
var intervalId;
var watchId;
var index = 0;

var formData = {};

$("#status p").text("Not tracking");
$('#start').on("click", startTrack);
$('#stop').on("click", stopTrack);

function startTrack(){
    if(navigator.geolocation){
        watchId = navigator.geolocation.watchPosition(geo_success, errorHandler,
        {enableHighAccuracy:true, maximumAge:30000, timeout:27000});
    }
    else{
        alert("Sorry, device does not support geolocation! Update your browser.");
    }
}

function stopTrack(){
    clearInterval(intervalId);
    navigator.geolocation.clearWatch(watchId);
    index = 0;
    $("#status p").text("Not tracking").removeClass("active").addClass("stopped");
    $("#start").removeAttr("disabled");
    $("#stop").attr("disabled", "disabled");
}

function geo_success(position){
    $("#status p").text("Tracking     active").removeClass("stopped").addClass("active");
    $("#start").attr("disabled", "disabled");
    $("#stop").removeAttr("disabled");

    lat = position.coords.latitude;
    lon = position.coords.longitude;

    formData.lat=lat;
    formData.lon=lon;

    if(index === 0){
        intervalId = setInterval(postData, sendInterval*1000);
    }

    index++;
}

function addTime(){
    // insert time in formData-object
    var d = new Date();
    var d_utc = ISODateString(d);

    formData.time=d_utc;

    // date to ISO 8601,
    // developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Date#Example.3a_ISO_8601_formatted_dates

function ISODateString(d){
        function pad(n){return n<10 ? '0'+n : n}
        return d.getUTCFullYear()+'-'
        + pad(d.getUTCMonth()+1)+'-'
        + pad(d.getUTCDate())+'D'
        + pad(d.getUTCHours()+2)+':'
        + pad(d.getUTCMinutes())+':'
        + pad(d.getUTCSeconds())+'T'
    }
}

function postData(){
    addTime();

    $.ajax({
        type:   'POST',
        url:    'save.php?file='+runnerId,
        data:   formData,
        async:  false,
    });
}

function errorHandler(err){ 
    if(err.code == 1) {
        alert("Error: Access was denied");
    }
    else if(err.code == 2) {
        alert("Error: Position is unavailable");
    }
}
});

Answer 1

如果您想在页面加载后立即开始跟踪并在页面关闭前停止堆叠，您应该在代码中替换为:

$('#start').on("click", startTrack);
$('#stop').on("click", stopTrack);

为此:

startTrack();
$( window ).on( 'unload', stopTrack );

并将此代码移动到 startTrack 函数定义下。