JQuery Show All Tab - 单击时出现问题

时间:2015-06-15 19:21:44

标签: jquery jquery-ui tabs sharepoint-2010

我一直在查看其他问题并尝试解决方案,但我们没有想出一个有效的解决方案,所以我想我会尝试并获得具体的帮助。

当您单击任何选项卡时,它们会以相反的顺序显示选项卡的所有内容,并在Web部件之间显示一些代码。我也不知道怎么样。得到它所以代码不会显示在网页上和b。如果您选择其他标签,请返回仅显示一个标签。

显示在页面上的代码:

javascript:commonShowModalDialog('{SiteUrl}/_layouts/itemexpiration.aspx?ID={ItemId}&List={ListId}', 'center:1;dialogHeight:500px;dialogWidth:500px;resizable:yes;status:no;location:no;menubar:no;help:no', function GotoPageAfterClose(pageid){if(pageid == 'hold') {STSNavigate(unescape(decodeURI('{SiteUrl}'))+'/_layouts/hold.aspx?ID={ItemId}&List={ListId}'); return false;} if(pageid == 'config') {STSNavigate(unescape(decodeURI('{SiteUrl}'))+'/_layouts/expirationconfig.aspx?ID={ItemId}&List={ListId}'); return false;}}, null); return false;
0x0
0x1
ContentType
0x01
898

JavaScript代码

<script type="text/javascript">
     jQuery(document).ready(function($) {

         $(".s4-wpcell").hide();
         $(".s4-wpcell-plain").hide();


         //Put the Web Part Title for all the Web Parts you wish
         //to put into the tabbed view into the array below.
        setTimeout(function() {
            HillbillyTabs(["Projects;#Projects","Notes;#Notes","Did You Know?;#Did You Know?"]);
        }, 800);

     $('#tabsContainer').click('tabsselect', function (event, ui) {
        var selectedTab = $("#tabsContainer").tabs('option', 'active');
        if(selectedTab = 3){
            $('div#tabsContainer div').show()
       } else{
        //not sure what to add here
    });

});

    function HillbillyTabs(webPartTitles)
    {

        if(webPartTitles == undefined)
        {
            var CEWPID = "";
            $("#tabsContainer").closest("div [id^='MSOZoneCell_WebPart']").find("span[id^='WebPartCaptionWPQ']").each(function()
            {
                CEWPID = $(this).attr("id");
            });

            var index = 0;
            $("span[id^='WebPartCaptionWPQ']").each(function()
            {
                if($(this).attr("id") != CEWPID)
                {
                    var title = $(this).prev("span").text();

                    $("#HillbillyTabs").append('<li><a href="#Tab'+index+'" id="TabHead'+index+'" onclick="HillbillyTabClick(this.id);">'+
                        title+'</a></li>').after('<div id="Tab'+index+'"></div>');

                    var webPart = $(this).prev("span").hide().closest("span").closest("[id^='MSOZoneCell_WebPart']");

                    $("#Tab" + index).append((webPart));
                    index++;
                }
            });
        } else {
        for(index in webPartTitles)
            {
                var title = webPartTitles[index];
                var tabContent = title.split(";#");
                if (tabContent.length > 1)
                {
                    $("#HillbillyTabs").append('<li><a href="#Tab'+index+'" id="TabHead'+index+'" onclick="HillbillyTabClick(this.id);">'+
                        tabContent[0]+'</a></li>').after('<div id="Tab'+index+'"></div>');

                    for(i = 1; i < tabContent.length; i++)
                    {
                        $("span[id^='WebPartCaptionWPQ']").each(function()
                        {
                            $(this).prev("span:contains('"+tabContent[i]+"')").each(function()
                            {
                                 if ($(this).text() == tabContent[i]){

                                    var webPart = $(this).closest("span").closest("[id^='MSOZoneCell_WebPart']").parent();

                                    $("#Tab" + index).append((webPart));
                                 }

                            });
                        });
                    }
                }
                else
                {
                    $("span[id^='WebPartCaptionWPQ']").each(function()
                    {
                        $(this).prev("span:contains('"+title+"')").each(function()
                        {
                             if ($(this).text() == title){
                                $("#HillbillyTabs").append('<li><a href="#Tab'+index+'" id="TabHead'+index+'" onclick="HillbillyTabClick(this.id);">'+
                                    title+'</a></li>').after('<div id="Tab'+index+'"></div>');

                                var webPart = $(this).hide().closest("span").closest("[id^='MSOZoneCell_WebPart']");

                                $("#Tab" + index).append((webPart));
                             }

                        });
                    });
                }
            }
        }

         //code to add it show all tab
        index++;
        var title = "Expand All";

        $("#HillbillyTabs").append('<li><a href="#Tab'+index+'" id="TabHead'+index+'" oonclick="HillbillyTabClick(this.id);">'+
        title+'</a></li>').after('<div id="Tab'+index+'"></div>');

        var webPart = $(this).prev("span").hide().closest("span").closest("[id^='MSOZoneCell_WebPart']");

        $("#Tab" + index).append((webPart));


        $("#tabsContainer").tabs();
        $(".s4-wpcell").show();
        $(".s4-wpcell-plain").show();


   }

    function SetCookie(id)
    {
           var date = new Date();
           //make the cookie expire in 5 minutes
           date.setTime(date.getTime()+(300*1000));
           var expires = "; expires="+date.toGMTString();
           document.cookie = "ActiveTab="+id+expires+"; path=/";
    }

    function ShowActiveTab()
    {
        var name = "ActiveTab";
        var cookieArray = document.cookie.split(";");
        for (index in cookieArray)
        {
            var keyValuePair = cookieArray[index].split("=");
            var key = keyValuePair[0];
            key  = key.replace(/^\s+|\s+$/g, "");
            if (key == name)
            {
                var value = keyValuePair[1];
                $("#" + value).click();
                return;
            }
        }
    }

</script>
<div id="tabsContainer"><ul id="HillbillyTabs"></ul></div>

这是我试图用来创建show all选项卡的on click功能的代码。它显示了所有内容,但是在加载页面时,但是当我单击选项卡时

 $('#tabsContainer').click('tabsselect', function (event, ui) {
    var selectedTab = $("#tabsContainer").tabs('option', 'active');
    if(selectedTab = 3){
        $('div#tabsContainer div').show()
   } else{
    //not sure what to add here
});

感谢您抽出宝贵时间,如果您需要更多信息,请与我们联系

1 个答案:

答案 0 :(得分:0)

我无法理解你的问题以提供太多帮助。也许把我们能看到的jsfiddle放在一起会有所帮助。

就页面上显示的代码而言,它来自您的javascript,您正在使用的javascript库,或者它只是作为HTML中的文本在页面上。首先,我会搜索您的项目文件以找到它。应该这样做。如果没有,请尝试排除您正在使用的javascript库,看它是否消失。这将指出问题。

无论如何,我认为我们需要更多信息或jsfiddle演示才能看到。