Question

我创建了一个nav-tabs并且效果很好，但是在页面上加载所有div都会出现。当我点击任何标签时，它可以正常工作。

<ul class="nav nav-tabs">
                        <li class="active"><a data-toggle="tab" href="#dados">Dados Cliente</a></li>
                        <li><a data-toggle="tab" href="#endereco">Endereço Cliente</a></li>
                        <li><a data-toggle="tab" href="#login">Login Cliente</a></li>
                    </ul>

                    <div class="tab-content">
                        <div id="dados" class="tab-pane fade in active">
                        <div class="form-group">
                                <label>Nome</label>
                                <h:inputText value="#{usuarioMB.cliente.nome}" styleClass="form-control" />
                            </div>
                        </div>
                        <div id="endereco" class="tab-pane fade in active">
                        </div>
                        <div id="login" class="tab-pane fade in active">
                            <div class="form-group">
                                <label>Email</label>
                                <h:inputText value="#{usuarioMB.usuario.email}"
                                    styleClass="form-control" />
                            </div>
                            <div class="form-group">
                                <label>Senha</label>
                                <h:inputSecret styleClass="form-control"
                                    value="#{usuarioMB.usuario.senha}" />
                            </div>
                        </div>

                    </div>

我已经尝试将#dados作为参数调用页面

criarusuario.xhtml?#dados

但它也不起作用

Answer 1

那是因为所有的tab div都有类Enum。

你应该有一个具有活动状态（tab-pane fade in active类）的div，而其他div应该只有tab-pane fade in active个类。

tab-pane fade

CSS类＆＃39;活跃＆＃39;不在加载页面上工作

1 个答案: