共用方式為

Control.ClientID 屬性

定義

命名空間:
System.Web.UI
組件:
System.Web.dll

取得由 ASP.NET 產生的 HTML 標記的控制 ID。

public:
 virtual property System::String ^ ClientID { System::String ^ get(); };
[System.ComponentModel.Browsable(false)]
public virtual string ClientID { get; }
[<System.ComponentModel.Browsable(false)>]
member this.ClientID : string
Public Overridable ReadOnly Property ClientID As String

屬性值

String

HTML 標記的控制 ID，由 ASP.NET 產生。

屬性
BrowsableAttribute

範例

以下範例展示了一個位於內容頁內的網頁使用者控制項，用於母版頁面。 使用者控制包含一個 DropDownList 控制項與一個 Label 控制項。 控制項中顯示 Label 的文字由使用者從控制項中選擇 DropDownList 的值決定。 文字值是透過用戶端腳本設定的，因此網頁不必再上傳到伺服器即可設定此值。 要取得客戶端腳本中為控制項渲染 Label 的 HTML 元素的參考，你必須知道控制項 ClientID 屬性的值。 然而，由於使用者控制項可置於網頁任意位置，無法事先知道哪些命名容器會包含這些控制項。 為了確保值 ClientID 與值 ID 相同，程式碼會將值設 ClientIDMode 為 Static。

以下範例展示了使用者的控制方式。

<%@ Control AutoEventWireup="true" %>

<script type="text/javascript">
  var seasonalSports = new Array("None selected",
                                 "Tennis",
                                 "Volleyball",
                                 "Baseball",
                                 "Skiing");

  function DisplaySport(x) {
      document.getElementById("SelectedSport").innerHTML
      = seasonalSports[x];
  }    
</script>

<asp:DropDownList ID="DropDownList1" runat="server" 
                  onchange="DisplaySport(this.selectedIndex);">
  <asp:ListItem Value="Select a season"></asp:ListItem>
  <asp:ListItem Value="Spring"></asp:ListItem>
  <asp:ListItem Value="Summer"></asp:ListItem>
  <asp:ListItem Value="Autumn"></asp:ListItem>
  <asp:ListItem Value="Winter"></asp:ListItem>
</asp:DropDownList>
<br />
<asp:Label ID="SelectedSport" runat="server" ClientIDMode="Static">
</asp:Label>

以下範例展示了包含使用者控制權的內容頁面。

<%@ Page Title="" MasterPageFile="~/Seasons.master" AutoEventWireup="true" %>

<%@ Register Src="Seasons.ascx" TagName="Seasons" TagPrefix="uc1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
  <uc1:Seasons ID="Seasons1" runat="server" />
</asp:Content>

以下範例顯示包含內容頁的母版頁面。

<%@ Master AutoEventWireup="true" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <asp:ContentPlaceHolder id="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
        
        </asp:ContentPlaceHolder>
    </div>
    </form>
</body>
</html>

備註

當網頁伺服器控制項被渲染為 HTML 元素時， id HTML 元素的屬性會設定為該 ClientID 屬性的值。 ClientID這個值常用於透過 Method 存取客戶端腳本document.getElementById中的 HTML 元素。 ID 也常用於 CSS 規則中指定要樣式的元素。 例如，以下 CSS 樣式規則會選擇所有 span 屬性值為 id 的 ProductIDLabel 元素，並將其設定 background-color 為 white：

span#ProductIDLabel { background-color: white; }

ASP.NET 提供多種演算法來產生 ClientID 屬性值。 你透過設定 ClientIDMode 控制項的屬性來選擇要使用的演算法。 這些演算法由 ClientIDMode 下表列出的列舉值來識別。

價值 說明
AutoID ClientID該值是透過將ID每個父命名容器的值與ID控制項的值串接而產生。 在資料綁定情境中，若同時渲染多個控制項實例，會在控制項 ID 值前插入遞增值。 每個段落以底線字元（_）分隔。 此演算法曾用於 ASP.NET 4之前的 ASP.NET 版本。
Static 價值 ClientID 設定為該房產的 ID 價值。 若控制項為命名容器，則該控制項作為命名容器階層的頂端，涵蓋其所包含的任何控制項。
Predictable 此演算法用於資料綁定控制的控制。 ClientID這個值是透過將父命名容器的值與ID控制項的值串接ClientID而產生的。 若控制項為資料綁定控制項，產生多列，則在最後加入屬性中 ClientIDRowSuffix 指定的資料欄位值。 控制 GridView 項可指定多個資料欄位。 若屬性 ClientIDRowSuffix 為空白，則會在末尾加入連續數字，取代資料欄位值。 每個段落以底線字元（_）分隔。
Inherit 控制則 ClientIDMode 繼承其 NamingContainer 控制的設定。

頁面的 ClientIDMode 預設值為 Predictable。 控制項的預設值 ClientIDMode 為 Inherit。 由於控制的預設為 Inherit，預設產生模式為 Predictable。 （不過，如果你使用 Visual Studio 將網頁專案從早期版本轉換成 ASP.NET 4，Visual Studio 會自動將網站預設設定為 AutoID Web.config。）

如需詳細資訊，請參閱 ASP.NET Web 伺服器控制識別。

適用於

另請參閱