如何仅在单击选项卡时加载数据 - 我想在单击“批准”选项卡时加载数据

Question

 <ul class="nav nav-tabs" role="tablist">
            <li class="active"><div id="tickets"><a href="#"  role="tab"  data-toggle="tab">My Tickets</a></div></li>
            <li class="active"><div id="approvals"><a href="#" role="tab" data-toggle="tab">My Approvals</a></div></li>
            <li class="active"><div id="watchlist"><a href="#" role="tab" data-toggle="tab">My Watchlist</a></div></li>
        </ul>

当我们点击下面的审批标签时，我必须加载它。 问题是，当我加载页面时，所有数据都会使页面变慢。 所以我想仅限制一个选项卡，然后在选项卡上单击加载数据。

                   <g:evaluate var="jvar_approvals" object="true">
                        var u = gs.getUserID();
                        var gr = new GlideRecord("sysapproval_approver");
                        gr.addQuery('approver',u);
                        gr.query();
                        gr;
                    </g:evaluate>