Question

我想控制打开Xpages时哪个选项卡处于活动状态（它将取决于文档所在的工作流程中的位置）。

下面我有两个引导选项卡，当加载页面时，它们都没有激活或显示。但是，输出脚本应该为我做到这一点？它似乎什么都不做。怎么了？

 <?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">
    <xp:this.resources>
        <xp:script src="/jQueryXSnippet.js" clientSide="true"></xp:script>
    </xp:this.resources>
    <xp:div styleClass="row">
        <xp:div styleClass="col-sm-12">
            <ul class="nav nav-tabs" id="list1">
                <li role="presentation" class="tab">
                    <a data-target="#inventory" data-toggle="tab">
                        Inventory
                    </a>
                </li>
                <li role="presentation">
                    <a data-target="#beingBuilt" data-toggle="tab">
                        Being Built
                    </a>
                </li>
            </ul>
            <div class="tab-content">
                <div class="tab-pane fade" id="inventory">
                    <xp:panel>
                        <xp:div styleClass="row"
                            style="height:20.00px">
                        </xp:div>
                        <div class="well well-sm">
                            <div class="form-group">DATA</div>
                        </div>
                    </xp:panel>
                </div>
                <div class="tab-pane fade" id="beingBuilt">
                    <xp:panel>
                        <xp:div styleClass="row"
                            style="height:20.00px">
                        </xp:div>
                        <div class="well well-sm">
                            <div class="form-group">DATA</div>
                        </div>
                    </xp:panel>
                </div>
            </div>
        </xp:div>
    </xp:div>
    <xp:scriptBlock id="scriptBlock2">
        <xp:this.value><![CDATA[$(document).ready(function()
{       
     x$("#{id:beingBuilt}").tab("show");    
}
)]]></xp:this.value>
    </xp:scriptBlock>
</xp:view>

Answer 1

将您的CSJS代码更改为

   <xp:scriptBlock id="scriptBlock2">
        <xp:this.value><![CDATA[$(document).ready(function() {      
            $("[data-target='#beingBuilt'").tab("show");    
        })]]></xp:this.value>
    </xp:scriptBlock>

ID为“beingBuilt”的div将呈现为

这就是你必须搜索属性为data-target="#beingBuilt"的元素的原因。你可以用纯jQuery这样做：

$("[data-target='#beingBuilt'")

带有Bootstrap面板的Xpage：打开xpage时如何设置活动选项卡？

1 个答案: