调整代码以扩展Sharepoint中的Web部件

时间:2018-01-12 20:39:49

标签: javascript jquery html css sharepoint

我试图调整我在网上找到的一些代码,以便在Sharepoint网站的Web部件旁边创建一个展开按钮。此代码的问题是默认情况下,所有Web部件都已展开,您必须单击才能折叠它。我只想让我的FAQ(WebPartWPQ7)Web部件已经折叠,用户只需点击一下即可展开它。其他Web部件不需要展开/折叠按钮。

<script type="text/javascript">
//
// Expand/Collapse Buttons
//

function WPToggle(thisId, ImageId) {
    if (document.getElementById(thisId).style.display == "none") {
        document.getElementById(thisId).style.display = "";
        document.getElementById(ImageId).src = "/_layouts/images/minus.gif";
    } else {
        document.getElementById(thisId).style.display = "none";
        document.getElementById(ImageId).src = "/_layouts/images/plus.gif";
    }
}

function ExpandCollapseBody() {
    var i = 1;
    var WPid = "WebPartWPQ1";
    var WPtitleid = "WebPartTitleWPQ1";
    var Toggleid = "ToggleImage1";
    do {
        try {
            document.getElementById(WPtitleid).innerHTML = '<IMG id="' + Toggleid + '" onClick="WPToggle(\'' + WPid + '\',\'' + Toggleid + '\')" alt="Expand/Collapse" style="margin:6px 5px 0px 2px; float:left; cursor:pointer;" src="/_layouts/images/minus.gif" />' + document.getElementById(WPtitleid).innerHTML;
            if (document.getElementById(WPid).style.display == "none") {
                document.getElementById(Toggleid).src = "/_layouts/images/plus.gif";
            }
        } catch (err) {}
        i = i + 1;
        WPid = "WebPartWPQ" + i;
        WPtitleid = "WebPartTitleWPQ" + i;
        Toggleid = "ToggleImage" + i;
    } while (document.getElementById(WPid))
}

_spBodyOnLoadFunctionNames.push("ExpandCollapseBody()");
</script>

1 个答案:

答案 0 :(得分:0)

如果您想要隐藏第7个Web部件,只需在初始化函数中添加if (i == 7) WPToggle(WPid, ToggleId);即可。在您标记问题时,使用jquery略微调整代码,我假设您可以使用它:

function WPToggle(thisId, ImageId) {
    var isVisible = $('#' + thisId).is(':visible');
    $('#' + thisId).toggle(!isVisible);

    var img = isVisible ?  'plus' : 'minus';
    $('#' + ImageId).attr('src', '/_layouts/images/' + img + '.gif');
}

function ExpandCollapseBody() {
    var i = 1;
    do {
        var WPid = 'WebPartWPQ' + i;
        var WPtitleid = 'WebPartTitleWPQ' + i;
        var Toggleid = 'ToggleImage' + i;
        var htmlImg = '<img id="' + Toggleid + '" alt="Expand/Collapse" style="margin:6px 5px 0px 2px; float:left; cursor:pointer;" src="/_layouts/images/minus.gif" />';
        var wpTitle = $('#' + WPtitleid).data('idx', i);
        wpTitle
            .html(htmlImg + wpTitle.html())
            .click(function() {
                var idx = $(this).data('idx');
                WPToggle('WebPartWPQ' + idx, 'ToggleImage' + idx);
            });
            if (i == 7) WPToggle(WPid, Toggleid);
        i++;
    } while ($('#WebPartWPQ' + i).length == 1)
}

_spBodyOnLoadFunctionNames.push("ExpandCollapseBody()");