单击选项卡时如何更改页面标题?

How to change Page title when click tab?

我的aspx页面和代码如下:

<%@ Page Title="" Language="C#" MasterPageFile="~/Autheticated.master" AutoEventWireup="true"
    CodeBehind="Default.aspx.cs" Inherits="PIWorks.PIWebNext.Pages.Default" %>

<%@ Import Namespace="System.Web.Optimization" %>
<asp:Content runat="server" ID="Content1" ContentPlaceHolderID="UxContentHead">
    <title>Public Reports</title> // default selected tab
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="UxContentMain" runat="server">
    <div ng-controller="homeController" style="height: 100%; width: 100%; position: relative;">
        <div pi-tab-view name="MainTabs" selected-tab-name="TabPublic">
            <div pi-tab name="TabDashBoard" is-visible="TabDashBoardIsVisible">
                <div class="tab-head">Dashboards</div> // dash tab
            </div>
            <div pi-tab name="TabPublic">
                <div class="tab-head">Public Reports</div>  // public report tab
            </div>
            <div pi-tab name="TabPrivate">
                <div class="tab-head">Private Reports</div>  // private report tab
            </div>
            <div pi-tab name="TabFavorite">
                <div class="tab-head">Favorite Reports</div>  //favorite report tab
            </div>
        </div>
    </div>
</asp:Content>

我想在单击私人报告选项卡(或其他选项卡)时更改页面标题

for example : click private report => Page Title : Private Reports
                    favorite report => Page Title : Favorite Reports
                    dashboard => Page Title : Dashboards

请问我该怎么做?

您可以使用 JavaScript 执行此操作:

document.title = "My Title";

有一些方法可以实现这一点。您可以使用 Javascript 如上所述。或者 JQuery。甚至是 aspx 本身。这是 JQuery 中的示例:

JQuery

$(document).on("click", ".tab-head", function trigger(){
  if(this.text() == "Public Reports"){
     document.title = "Public Reports";
  }
  else if...
});