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
1 <td valign="middle" class="ms-globallinks">
2 <span style="display:none">
3 <menu type='ServerMenu' id="zz3_ID_PersonalActionMenu" largeIconMode="true">
4 <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>
5 <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>
6 <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">
7 </ie:menuitem>
8 <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>
9 <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>
10 </menu>
11 </span>
12 <span title="Open Menu">
13 <div id="zz9_Menu_t" class="ms-SPLink ms-SpLinkButtonInActive" onmouseover="MMU_PopMenuIfShowing(this);MMU_EcbTableMouseOverOut(this, true)" hoverActive="ms-SPLink ms-SpLinkButtonActive" hoverInactive="ms-SPLink ms-SpLinkButtonInActive" onclick=" MMU_Open(byid('zz3_ID_PersonalActionMenu'), MMU_GetMenuFromClientId('zz9_Menu'),event,false, null, 0);" foa="MMU_GetMenuFromClientId('zz9_Menu')" oncontextmenu="this.click(); return false;" nowrap="nowrap">
14 <a id="zz9_Menu" accesskey="L" href="#" onclick="javascript:return false;" style="cursor:hand;white-space:nowrap;" onfocus="MMU_EcbLinkOnFocusBlur(byid('zz3_ID_PersonalActionMenu'), this, true);" onkeydown="MMU_EcbLinkOnKeyDown(byid('zz3_ID_PersonalActionMenu'), MMU_GetMenuFromClientId('zz9_Menu'), event);" onclick=" MMU_Open(byid('zz3_ID_PersonalActionMenu'), MMU_GetMenuFromClientId('zz9_Menu'),event,false, null, 0);" oncontextmenu="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>
15 <img align="absbottom" src="/_layouts/images/menudark.gif" alt="" />
16 </div>
17 </span>
18 <script type="text/javascript" language="javascript">var _spUserId=1;</script>
19 </td>
于是想到了可以用JavaScript在客户端改样式和下拉菜单。
如下：
在自定义模板页Main.master中body标签加入onload方法：
<body onload="pageOnload()">
pageOnload实现：
1 function pageOnload()
2 {
3 var welcomeLink = document.getElementById("zz6_Menu");
4 if(welcomeLink != null)
5 {
6 welcomeLink.style.color = "#fff";
7 }
8 var PersonalActionMenu = document.getElementById("zz1_ID_PersonalActionMenu");
9 if(PersonalActionMenu != null)
10 {
11 var PersonalInformation = document.getElementById("zz2_ID_PersonalInformation");
12 if(PersonalInformation!= null)
13 {
14 PersonalActionMenu.removeChild(PersonalInformation);
15 }
16 var RequestAccess= document.getElementById("zz4_ID_RequestAccess");
17 if(RequestAccess!= null)
18 {
19 PersonalActionMenu.removeChild(RequestAccess);
20 }
21 }
22 }
最终效果：
