在URL中存储值,在浏览器中保留原始值

Store value in URL with keeping the original values in browser

本文关键字:保留 原始 浏览器 URL 存储      更新时间:2023-09-26

所以我使用JavaScript创建一个ASP.net页面来计算两个邮政编码之间的距离。提交表单后,页面显示地址和距离。但是,我想在ASP中使用这些值。.net所以我在URL中存储了距离,所以我可以用。NET标签调用它,但当我这样做时,因为它必须回到服务器,它刷新页面并删除JavaScript计算值!我想在URL中存储距离,以保持计算值在页面上。这是我现在有的

var geocoder, location1, location2;

function initialize() {
    geocoder = new GClientGeocoder();
}
function showLocation() {
    geocoder.getLocations(document.forms[0].address1.value, function (response) {
        if (!response || response.Status.code != 200)
        {
            alert("Sorry, we were unable to geocode the first address");
        }
        else
        {
            location1 = {lat: response.Placemark[0].Point.coordinates[1], lon: response.Placemark[0].Point.coordinates[0], address: response.Placemark[0].address};
            geocoder.getLocations(document.forms[0].address2.value, function (response) {
                if (!response || response.Status.code != 200)
                {
                    alert("Sorry, we were unable to geocode the second address");
                }
                else
                {
                    location2 = {lat: response.Placemark[0].Point.coordinates[1], lon: response.Placemark[0].Point.coordinates[0], address: response.Placemark[0].address};
                    calculateDistance();
                }
            });
        }
    });
}
function calculateDistance()
{
    try
    {
        var glatlng1 = new GLatLng(location1.lat, location1.lon);
        var glatlng2 = new GLatLng(location2.lat, location2.lon);
        var miledistance = glatlng1.distanceFrom(glatlng2, 3959).toFixed(1);
        var kmdistance = (miledistance * 1.609344).toFixed(1);

        document.getElementById('results').innerHTML = 
        '<strong>Address 1: </strong>' + location1.address + 
        '<br /><strong>Address 2: </strong>' + location2.address + 
        '<br /><strong>Distance: </strong>' + miledistance + ' miles (or ' + kmdistance + ' kilometers)';
        //+ '<br /><strong>HiddenField </strong>' + miledistance;
                var loc = self.location.href;
        window.location.href = loc+"?D="+miledistance;
    }
    catch (error)
    {
        alert(error);
    }
}

</script>

<form action="#" onsubmit="showLocation();return false;">
  <p>
    <input type="text" name="address1" value="45419" class="address_input" size="40" />
    <input type="text" name="address2" value="47714" class="address_input" size="40" />
    <input type="submit" name="find" value="Search" />
  </p>
</form>
<p id="results"></p>
<form id="form1" runat="server">
<div>
    <asp:Label ID="Label3" runat="server"></asp:Label>
    <br />
    <asp:Label ID="Label2" name="address1" value="Address 1" class="address_input" size="40" runat="server"></asp:Label>
<br />
    <asp:Label ID="Label1" runat="server"></asp:Label>
    <br />
    <br />
    <asp:Button ID="Button1" runat="server" PostBackUrl="~/Size.aspx?a='miledistance'" Text="Next" />
</div>
</form>

您应该使用表单字段将值传递回服务器,而不是作为URL中的参数。

尝试在表单中添加一个名为distance的隐藏字段:

<input type="hidden" name="distance" value=""/>

然后在calculateDistance()函数中填充这个隐藏字段:

document.getElementById('distance').value = miledistance;

然后你可以在服务器端获取这个值:

string distance = Request["distance"];

int distance = Convert.ToInt32(Request["distance"]);

如果您希望在返回后在屏幕上显示此值,则使用Literal表单控件。

祝你好运!