SharePoint Welcome.ascx 控件自定义样式的另类解决方式

SharePoint网站中默认的welcome菜单如下样式是固定的如下：

下拉列表如下：

现在需要把菜单颜色改成白色，下拉列表中只保留Sign in as Different User 和 Sign Out两项。

查看相关代码如下：

<%@ Register TagPrefix="wssuc" TagName="Welcome" src="~/_controltemplates/Welcome.ascx" %>

<wssuc:Welcome id="IdWelcomeMain" runat="server" EnableViewState="false" >
</wssuc:Welcome>  

网上查了很多方法都是需要改写Welcome.ascx控件。Welcome.ascx是在SharePoint服务器上，但是公司安装SharePoint环境是没法擅自改的。于是想到了一个另类的解决方法。

查看客户端Welcome部分代码如下：

View Code 
 <td valign="middle" class="ms-globallinks">
     <span style="display:none">
         <menu type='ServerMenu' id="zz3_ID_PersonalActionMenu" largeIconMode="true">
             <ie:menuitem id="zz4_ID_PersonalInformation" type="option" iconSrc="/_layouts/images/menuprofile.gif" onMenuClick="javascript:GoToPage('\u002fteams\u002fmysite\u002f_layouts\u002fuserdisp.aspx?Force=True\u0026ID=' + _spUserId);return false;" text="My Settings" description="Update your user information, regional settings, and alerts." menuGroupId="100"></ie:menuitem>
             <ie:menuitem id="zz5_ID_LoginAsDifferentUser" type="option" onMenuClick="javascript:LoginAsAnother('\u002fteams\u002fmysite\u002f_layouts\u002fAccessDenied.aspx?loginasanotheruser=true', 0)" text="Sign in as Different User" description="Login with a different account." menuGroupId="200"></ie:menuitem>
             <ie:menuitem id="zz6_ID_RequestAccess" type="option" onMenuClick="window.location = '/teams/mysite/_layouts/reqacc.aspx?type=web';" text="Request Access" description="Email the site administrator to request additional permissions." menuGroupId="200">
             </ie:menuitem>
             <ie:menuitem id="zz7_ID_Logout" type="option" onMenuClick="window.location = '/teams/mysite/_layouts/SignOut.aspx';" text="Sign Out" description="Logout of this site." menuGroupId="200"></ie:menuitem>
             <ie:menuitem id="zz8_ID_PersonalizePage" type="option" iconSrc="/_layouts/images/menupersonalize.gif" onMenuClick="javascript:MSOLayout_ChangeLayoutMode(true);" text="Personalize this Page" description="Add, remove, or update Web Parts on this page." menuGroupId="300"></ie:menuitem>
         </menu>
     </span>
     <span title="Open Menu">
         <div  id="zz9_Menu_t" class="ms-SPLink ms-SpLinkButtonInActive" οnmοuseοver="MMU_PopMenuIfShowing(this);MMU_EcbTableMouseOverOut(this, true)" hoverActive="ms-SPLink ms-SpLinkButtonActive" hoverInactive="ms-SPLink ms-SpLinkButtonInActive" οnclick=" MMU_Open(byid('zz3_ID_PersonalActionMenu'), MMU_GetMenuFromClientId('zz9_Menu'),event,false, null, 0);" foa="MMU_GetMenuFromClientId('zz9_Menu')" οncοntextmenu="this.click(); return false;" nowrap="nowrap">
             <a id="zz9_Menu" accesskey="L" href="#" οnclick="javascript:return false;" style="cursor:hand;white-space:nowrap;" οnfοcus="MMU_EcbLinkOnFocusBlur(byid('zz3_ID_PersonalActionMenu'), this, true);" οnkeydοwn="MMU_EcbLinkOnKeyDown(byid('zz3_ID_PersonalActionMenu'), MMU_GetMenuFromClientId('zz9_Menu'), event);" οnclick=" MMU_Open(byid('zz3_ID_PersonalActionMenu'), MMU_GetMenuFromClientId('zz9_Menu'),event,false, null, 0);" οncοntextmenu="this.click(); return false;" menuTokenValues="MENUCLIENTID=zz9_Menu,TEMPLATECLIENTID=zz3_ID_PersonalActionMenu" serverclientid="zz9_Menu">Welcome Bu, Xiao-Yang (Shawn)<img src="/_layouts/images/blank.gif" border="0" alt="Use SHIFT+ENTER to open the menu (new window)."/></a>
             <img align="absbottom" src="/_layouts/images/menudark.gif" alt="" />
         </div>
     </span>
     <script type="text/javascript" language="javascript">var _spUserId=1;</script>
  </td>

于是想到了可以用JavaScript在客户端改样式和下拉菜单。

如下：

在自定义模板页Main.master中body标签加入onload方法：

function pageOnload()
 {
      var welcomeLink = document.getElementById("zz6_Menu");
      if(welcomeLink != null)
      {
          welcomeLink.style.color = "#fff";
      }
      var PersonalActionMenu = document.getElementById("zz1_ID_PersonalActionMenu");
      if(PersonalActionMenu != null)
      {
         var PersonalInformation = document.getElementById("zz2_ID_PersonalInformation");
         if(PersonalInformation!= null)
         {
             PersonalActionMenu.removeChild(PersonalInformation);
         }
         var RequestAccess= document.getElementById("zz4_ID_RequestAccess");
         if(RequestAccess!= null)
         {
             PersonalActionMenu.removeChild(RequestAccess);
         }
      }
 }

最终效果：

 

转载于:https://www.cnblogs.com/KohnKong/articles/2594781.html