javascript - 在 ejs 中有两个选项卡，当我返回到原始选项卡时它停留在第二个选项卡上，任何建议表示赞赏

Question

伙计们有点卡住了，正在为数据库类开发一个程序，遇到了一个我似乎无法解决的讨厌问题。所以当我进入产品页面时，我有 2 个选项卡、产品和产品列表。当我进入页面时，我在产品选项卡上，我可以毫无问题地添加产品。但是，当我切换到包含产品列表的选项卡，然后尝试返回到产品选项卡时，即使它突出显示了产品选项卡，它仍然停留在产品列表中。

<ul class="nav nav-tabs  tabs" role="tablist">
    <li class="nav-item">
        <a class="nav-link active" data-toggle="tab" href="#productos" role="tab">Productos</a>
    </li>
    <li class="nav-item">
        <a class="nav-link" data-toggle="tab" href="#lis_productos" role="tab">Lista de Productos</a>
    </li>
</ul>
<!-- Tab panes -->
<div class="tab-content tabs card-block">
    <div class="tab-pane active" id="reg_producto" role="tabpanel">
        <form action="/registrar_producto" method="POST">
            <div class="form-group">
                <label for="codigo_producto">Código de Producto</label>
                <input type="codigo_producto" id="codigo_producto" name="codigo_producto" class="form-control"
                    placeholder="Digite un código de producto"
                    value="<%= typeof codigo_producto != 'undefined' ? codigo_producto : '' %>" />
            </div>
            <div class="form-group">
                <label for="nombre_producto">Nombre de Producto</label>
                <input type="nombre_producto" id="nombre_producto" name="nombre_producto" class="form-control"
                    placeholder="Confirme Nombre de Producto"
                    value="<%= typeof nombre_producto != 'undefined' ? nombre_producto : '' %>" />
            </div>
            <div class="form-group">
                <label for="descripcion">Descripción</label>
                <input type="descripcion" id="descripcion" name="descripcion" class="form-control"
                    placeholder="Entra descripcion 150 caracteres o menos"
                    value="<%= typeof descripcion != 'undefined' ? descripcion : '' %>" />
            </div>
            <button type="submit" class="btn btn-primary btn-block">
                Añadir Producto
            </button>
        </form>
    </div>
    <div class="tab-pane" id="lis_productos" role="tabpanel">
        <div class="dt-responsive table-responsive">
            <table id="simpletable" class="table table-striped table-bordered nowrap">
            </table>
        </div>
    </div>
</div>

Answer 1

您的 href 必须引用您要激活的标签页的 ID

尝试更改为:

 <li class="nav-item">
    <a class="nav-link active" data-toggle="tab" href="#reg_producto" role="tab">Productos</a>
</li>