重新加载选项卡的一部分及其标签计数器，但停留在那里而不刷新页面

Question

我可以就这段代码寻求帮助吗？我正在重新加载 div 的一部分（基本上是一个标签上带有计数器的选项卡）以更新其中的当前项目数。我只能使用以下方法成功地重新加载 div 的一部分：

$("#custom-tabs-one-tab").load(location.href + " #custom-tabs-one-tab"); .

这是我要重新加载的代码部分。（仅此 div）

<div class="card-header p-0 pt-1" id="append_note_data_counter_tab">

    <ul class="nav nav-tabs" id="custom-tabs-one-tab" role="tablist">

        <?php if ($user['appendtimekeepingapproval'] == 'true') { ?>

            <li role="presentation" class="nav-item">

                <a class="nav-link active" href="#append_note-tab1" aria-controls="append_note-tab1" role="tab" data-toggle="tab">Append Timekeeping Approval&nbsp;<span class="badge badge-primary"><?php echo $eatimekeepingcountapproval; ?></span></a>

            </li>

        <?php } ?>

        <?php if ($user['authorizedovertimeapproval'] == 'true') { ?>

            <li role="presentation" class="nav-item">

                <a class="nav-link" href="#append_note-tab2" aria-controls="append_note-tab2" role="tab" data-toggle="tab">Authorized Overtime Approval&nbsp;<span class="badge badge-success"><?php echo $eaovertimecountapproval; ?></a>

            </li>

        <?php } ?>

        <?php if ($user['changescheduleapproval'] == 'true') { ?>

            <li role="presentation" class="nav-item">

                <a class="nav-link" href="#append_note-tab3" aria-controls="append_note-tab3" role="tab" data-toggle="tab">Change Schedule Approval&nbsp;<span class="badge badge-warning"><?php echo $hrchangeschedcountapproval; ?></a>

            </li>

        <?php } ?>

        <?php if ($user['departmentscheduleapproval'] == 'true') { ?>

            <li role="presentation" class="nav-item">

                <a class="nav-link" href="#append_note-tab4" aria-controls="append_note-tab4" role="tab" data-toggle="tab">Department Schedule Approval&nbsp;<span class="badge badge-danger"><?php echo $easchedulelistcountapproval; ?></a>

            </li>

        <?php } ?>

    </ul>

该选项卡正在重新加载并正在更新计数器，但问题是它没有停留在之前的选项卡选择中，它总是回到第一个选项卡。

这个问题有解决方法吗？提前谢谢大家。

Answer 1

通过将回调传递给.load函数，尝试在 div 重新加载后选择活动选项卡。是这样的：$("#custom-tabs-one-tab").load(location.href + " #custom-tabs-one-tab", function() {&nbsp; &nbsp; var activeTab = localStorage.getItem('activeTab');&nbsp; &nbsp; if(activeTab){&nbsp; &nbsp; &nbsp; &nbsp; $('#custom-tabs-one-tab a[href="' + activeTab + '"]').tab('show');&nbsp; &nbsp; }});