Как получить геолокацию, а затем автоматически отправить форму, не нажимая кнопку - PullRequest
Новая
       3

Как получить геолокацию, а затем автоматически отправить форму, не нажимая кнопку

1 голос
/ 25 апреля 2019

Я хочу вызвать страницу, чтобы получить геолокацию, а затем автоматически отправить форму на мою страницу php в $_REQUEST getlat и getlon, не нажимая кнопку отправки.Вот что у меня есть.В инспекторе браузера отображаются значения геолокации, но они не отправляются автоматически.Я попытался использовать функцию onload в своем теге body, но потом обнаружил, что вы можете вызывать только одну функцию за раз, также я прочитал, что в любом случае это плохая практика.У меня есть другие похожие вопросы, но я не могу их собрать.Спасибо за любую помощь 

<html>
    <script>
        function getLocation() {
            if (navigator.geolocation) {
                navigator.geolocation.getCurrentPosition(
                    showPosition,
                    positionError
                );
            }
        }

        function showPosition(position) {
            document.getElementById('getlat').value = position.coords.latitude;
            document.getElementById('getlon').value = position.coords.longitude;
            lon = document.getElementById('getlon').value;
            lat = document.getElementById('getlat').value;
        }

        function positionError(error) {
            if (error.PERMISSION_DENIED) alert('Please accept geolocation');
            hideLoadingDiv();
            showError(
                'Geolocation is not enabled. Please enable to use this feature'
            );
        }
    </script>

    <script>
        function PageLoad() {
            getLocation();
            document.frm1.submit();
        }
    </script>

    <body>
        <script>
            window.onload = PageLoad();
        </script>

        <form action="results.php" name="frm1">
            <input type="hidden" name="longitude" id="getlon" />
            <input type="hidden" name="latitude" id="getlat" />
        </form>
    </body>
</html>

Ответы [ 2 ]

1 голос
/ 25 апреля 2019

Вы, должно быть, не знаете об асинхронной природе javascript, иначе это очень простая проблема.В любом случае, здесь я объясняю

Когда страница загружается и находит window.onload=PageLoad();, она вызывает функцию PageLoad(), а затем 

function PageLoad() {
    getLocation(); // <-- gets called
    document.frm1.submit(); // <-- doesn't wait for getLocation() to complete; 
                            // rather runs right away
}

Как вы можете догадаться, пока getLocation() делает свою работу(в сортировке «нить» A) document.frm1.submit(); запускается (в другой сортировке «нить» B) и отправляет форму, которая не соответствует вашим ожиданиям.

Так что вместо этого вам нужно переместитьотправьте соответствующий код в showPosition(), чтобы браузер узнал местоположение и отправил форму. 

function showPosition(position) {
    document.getElementById("getlat").value = position.coords.latitude;
    document.getElementById("getlon").value = position.coords.longitude;
    lon=document.getElementById("getlon").value;
    lat=document.getElementById("getlat").value;
    document.frm1.submit(); <-- submits when browser gets the users location
}
0 голосов
/ 25 апреля 2019

Согласно МДН Документация

Метод getCurrentPosition (). Это инициирует асинхронный запрос к определить положение пользователя

Вы отправляете форму до получения координат. Решение состоит в том, чтобы отправить эту форму со значением обновленных скрытых входных данных только после завершения асинхронного запроса. Пожалуйста, попробуйте следующий пример

Имея этот HTML 

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <title>Document</title>
    </head>
    <body>
        <form action="results.php" name="frm1">
            <input type="hidden" name="longitude" id="getlon" />
            <input type="hidden" name="latitude" id="getlat" />
        </form>
        <script src="geo.js"></script>
    </body>
</html>

JS 

document.addEventListener('DOMContentLoaded', () => {
    pageLoad();
});

function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition, positionError);
    }
}

function showPosition(position) {
    console.log(position);
    document.getElementById('getlat').value = position.coords.latitude;
    document.getElementById('getlon').value = position.coords.longitude;
    lon = document.getElementById('getlon').value;
    lat = document.getElementById('getlat').value;

    document.frm1.submit(); // here the form is submit
}

function positionError(error) {
    if (error.PERMISSION_DENIED) alert('Please accept geolocation');
    hideLoadingDiv();
    showError('Geolocation is not enabled. Please enable to use this feature');
}

function pageLoad() {
    getLocation();
}

Здесь я использую, когда DOM готов

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...