使用ASP.NET和JQuery Mobile的innerHtml

Question

我正在進行移動搜索，使用您的位置來確定郵政編碼服務器端，但是當嘗試將兩個標簽設置為緯度和經度以發送到服務器時，我收到一個錯誤，聲稱innerHtml為空。 進一步檢查后，元素為空。 為什么會這樣？

<%@ Page Title="" Language="C#" MasterPageFile="~/Site1.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Search.Default" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<script language="javascript" type="text/javascript">
    navigator.geolocation.getCurrentPosition(foundLocation, noLocation);
    var latitude;
    var longitude;
    function foundLocation(position) {
        latitude = position.coords.latitude;
        longitude = position.coords.longitude;
        alert('Your location: ' + latitude + ', ' + longitude);
    }
    function noLocation() {
        //Do something here in the case that no location is found, or user denies access
    }
    function getLocation() {
        document.getElementById("ct100_ContentPlaceHolder1_lblLat").innerHtml = latitude;
        document.getElementById("ct100_ContentPlaceHolder1_lblLong").innerHtml = longitude;
    }
</script>   
<div data-role="page">
    <div data-role="header">
        <h1>Provider Search</h1>
    </div>
    <div data-role="content">
        <asp:Button ID="btnSearch" Text="Search" runat="server" data-role="button" OnClientClick="getLocation()" OnClick="btnSearch_Clicked"></asp:Button>
        <asp:Label ID="lblLat" runat="server"></asp:Label>
        <asp:Label ID="lblLong" runat="server"></asp:Label>
        <p></p> 

    </div>

</div>

</asp:Content>

我想請注意，除了標簽的設置外，本文檔中的所有內容都完美無缺。

此外，ID前綴ct100_ContentPlaceHolder1_是由asp.net在運行時生成的，這可以通過在調試時查看頁面源來確認。

有幫助嗎？

Answer 1

在你的getLocation（）函數中，你可以嘗試執行以下操作：

function getLocation() {
    $('#<%=lblLat.ClientID%>').html(latitude);
    $('#<%=lblLong.ClientID%>').html(latitude);
}

您也可以嘗試以類似的方式設置兩個標簽的text屬性：

function getLocation() {
    $('#<%=lblLat.ClientID%>').text(latitude);
    $('#<%=lblLong.ClientID%>').text(latitude);
}