使用 JavaScript 创建自定义欢迎答案

【问题标题】：Using JavaScript to create custom welcome使用 JavaScript 创建自定义欢迎
【发布时间】：2013-09-21 06:02:15
【问题描述】：

我在 SharePoint 内容编辑器 Web 部件 (CEWP) 中使用脚本，该脚本根据名称和时间欢迎用户访问网站，然后还有另一个链接。我在格式化它时遇到问题。我已经自定义了我的工作脚本，但由于某种原因字体大小和颜色无法正常工作。有人可以指出我正确的方向吗？我认为这与我的“var WelcomeMenuContent”有关，但不确定。

一如既往地感谢任何帮助：

<script type="text/javascript" src="https://wss.companyabc.org/sites/WSS001905/SiteAssets/Libraries/jquery-1.10.2.min.js"></script>

<style type="text/css">
#Header {
font-family: Arial;
color: #cc0717;
font-size: 3em;
text-decoration: underline;
}
#SubHeader {
font-family: Arial;
color:#000000;
font-size: 1.5em;
}
#Hyperlink{
font-family: Arial;
color:#cc0717;
weight: bold;
font-size: 1em;
}
</style>

<center>
<div class="Header">
<span id="greeting">Hello</span>
<script type = "text/javascript">
    $(document).ready(function(){
        var WelcomeMenuContent = $('.ms-welcomeMenu > a.ms-menu-a > span');
        var UserName = WelcomeMenuContent.text();
        var FirstName = UserName.split(" ")[0];
        var Display;
        var Digital = new Date()
        var Hours = Digital.getHours()

        Morning = 'Good morning' + " " + FirstName;
        Lunch = 'Good afternoon' + " " + FirstName;
        Evening = 'Good evening' + " " + FirstName;
        Night = 'Good night' + " " + FirstName;
        TimeElse = 'Welcome' + " " + FirstName;

            if (Hours >= 5 && Hours <= 11) 
                document.getElementById("greeting").innerHTML=(Morning);
                    else if (Hours >= 12 && Hours <= 17) 
                document.getElementById("greeting").innerHTML=(Lunch);
                    else if (Hours >= 18 && Hours <= 22) 
                document.getElementById("greeting").innerHTML=(Evening);
                    else if (Hours >= 23 && Hours <= 4) 
                document.getElementById("greeting").innerHTML=(Night);
            else
                document.getElementById("greeting").innerHTML=(TimeElse);
    }); 
</script>
</div>
    <div class="SubHeader">
        <span>Welcome to the home of Company ABC</span>
    </div>
</br>
<hr>
</br>
    <div class="Hyperlink">
        <a href="http://www.google.com">Click here to continue to the  Community SharePoint Site</a>
    </div>
<hr>
</br>

</center>

【问题讨论】：

标签： javascript jquery css sharepoint

【解决方案1】：

您正在使用 ID 来处理课程。在 CSS 中，# 处理 id 属性，而. 处理类属性。更改以下内容：

#Header      >>    >> .Header 
#SubHeader   >> to >> .SubHeader
#Hyperlink   >>    >> .Hyperlink

请注意，由于您已经在使用 jQuery，请考虑更改

 document.getElementById("greeting").innerHTML=(Morning);

到

 $('#greeting').text(Morning);

【讨论】：

Css 再次欺骗了我！非常感谢。我尝试使用 $ 对象进行测试： else if (Hours >= 12 && Hours
$('#greeting')，而不是$('greeting')。 # 查找 ID，没有哈希查找 HTML 标记名称。

【解决方案2】：

仅供参考 Bamboo 解决方案有一个免费的网络部件，可以处理自定义问候语，但它可能不如您尝试编写的代码那么强大：

Hello WebPart http://store.bamboosolutions.com/c-1-helper-web-part.aspx

【讨论】：