Question

我在表单上有三个隐藏变量。我必须使用javascript函数设置这些变量，然后我必须重新加载页面，以便我可以使用带有一些php代码的表单变量。

我遇到的问题是，首先，我不知道何时应该调用javascript函数。我提交表单后设法调用它，但后来我无法刷新页面。所以我在第一次加载页面时让javascript函数运行但是我认为隐藏字段的变量没有正确设置。

这是我的javascript代码，第一个版本。在这个版本中，我有一个gps函数，在提交表单后调用它。

<script>

function gps(){
    if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(GetLocation, showError);
    }
    else {
      alert('Geolocation is not supported for this Browser/OS version yet.');
    }

}

function GetLocation(location) {

    document.getElementById("latitude").value=location.coords.latitude;
    document.getElementById("longitude").value=location.coords.longitude;
    document.getElementById("accuracy").value=location.coords.accuracy;

}

function showError(error) {
    switch(error.code) {
        case error.PERMISSION_DENIED:
            x.innerHTML = "User denied the request for Geolocation."
            break;
        case error.POSITION_UNAVAILABLE:
            x.innerHTML = "Location information is unavailable."
            break;
        case error.TIMEOUT:
            x.innerHTML = "The request to get user location timed out."
            break;
        case error.UNKNOWN_ERROR:
            x.innerHTML = "An unknown error occurred."
            break;
    }
}
</script>

这是我的简化表格代码

<form id="emoteForm" action="" onsubmit="gps(); return false;" target="_top" method="post" name="emote">

<input hidden="true" type="text" id="latitude" name="latitude">
<input hidden="true" type="text" id="longitude" name="longitude">
<input hidden="true" type="text" id="accuracy" name="accuracy">

<h4><input id="but" class="btn btn-primary btn-lg" role="button" value="Submit" type="submit" name="submit" onclick="show('form'); return FALSE;"></h4>

</form>

现在这是在本页面的html代码之前的PHP代码，我必须在提交表单后运行。

<?PHP

session_start();

if(!isset($latitude)){
    echo "Do something";
}

if(postvar("submit")=="Submit"){
     echo "Submitting";
}

?>

因此，当我第一次加载页面时，我得到了“做某事”的文本，因为纬度变量仍未设置，所以这很好。当我点击提交按钮时，我被要求允许获取我的GPS位置，因为它正在调用gps（）函数。在此功能中，设置变量纬度，经度和精度。但是页面没有重新加载。

我怎么能做两件事，在提交时设置变量值然后重新加载页面并保留值，这样我就可以用我的php代码。有什么想法吗？

编辑1：

添加了代码以控制是否已设置位置

<script>

function gps(){
    if (navigator.geolocation) {
      if (typeof localStorage['authorizedGeoLocation'] == "undefined" || localStorage['authorizedGeoLocation'] == "0") {
      navigator.geolocation.getCurrentPosition(GetLocation, showError);
      return false;
      }else{
      return true;}
    }
    else {
      alert('Geolocation is not supported for this Browser/OS version yet.');
    }

}

function GetLocation(location) {

    document.getElementById("latitude").value=location.coords.latitude;
    document.getElementById("longitude").value=location.coords.longitude;
    document.getElementById("accuracy").value=location.coords.accuracy;

    localStorage['authorizedGeoLocation'] = 1;

    document.getElementById("emoteForm").submit();

}

}

function showError(error) {
    localStorage['authorizedGeoLocation'] = 0;
    switch(error.code) {
        case error.PERMISSION_DENIED:
            x.innerHTML = "User denied the request for Geolocation."
            break;
        case error.POSITION_UNAVAILABLE:
            x.innerHTML = "Location information is unavailable."
            break;
        case error.TIMEOUT:
            x.innerHTML = "The request to get user location timed out."
            break;
        case error.UNKNOWN_ERROR:
            x.innerHTML = "An unknown error occurred."
            break;
    }
}
</script>

Answer 1

当您使用bundles.Add(new StyleBundle("~/Content/css", "http://CDN_URL.vo.msecnd.net/Content/css") // If it falls, then your website content will be loaded .IncludeFallback("~/Content/css", "sr-only", "width", "1px") .Include( "~/Content/bootstrap.css", "~/Content/site.css"));时，您正在取消表单提交，这是正确的; bundles.Add(new ScriptBundle("~/bundles/jquery", "http://CDN_URL.vo.msecnd.net/bundles/jquery") // If it falls, then your website content will be loaded { CdnFallbackExpression = "window.jquery" } .Include("~/Scripts/jquery-{version}.js"));是异步的，因此您必须等到它完成后才能立即提交表单。

当onsubmit="gps(); return false;"完成时，将调用getCurrentPosition()函数并填充变量。现在，您可以提交表单，以便向服务器发出包含新设置值的请求：

getCurrentPosition()

请注意，这可能需要一些时间，因此您应该向访问者显示正在提交表单的消息，禁用提交按钮等。

Answer 2

我终于通过在提交表单之前获取位置数据来解决这个问题。所以我摆脱了gps()函数并正常提交了表单。像这样。

<script>

if (navigator.geolocation) {
  document.getElementById("but").disabled = true;
  document.getElementById("but").value = "GPS information is loading";
  navigator.geolocation.getCurrentPosition(GetLocation, showError);
}
else {
  document.getElementById("but").disabled = true;
  document.getElementById("but").value = "No GPS information";
  alert('Geolocation is not supported for this Browser/OS version yet.');
}

function GetLocation(location) {

    document.getElementById("latitude").value=location.coords.latitude;
    document.getElementById("longitude").value=location.coords.longitude;
    document.getElementById("accuracy").value=location.coords.accuracy;

    document.getElementById("but").disabled = false;  
    document.getElementById("but").value = "Submit";
}

function showError(error) {
    switch(error.code) {
        case error.PERMISSION_DENIED:
            x.innerHTML = "User denied the request for Geolocation."
            break;
        case error.POSITION_UNAVAILABLE:
            x.innerHTML = "Location information is unavailable."
            break;
        case error.TIMEOUT:
            x.innerHTML = "The request to get user location timed out."
            break;
        case error.UNKNOWN_ERROR:
            x.innerHTML = "An unknown error occurred."
            break;
    }
}
</script>

使用javascript使用表单提交变量

2 个答案: