javascript - Php/Jquery/Ajax : On Accordian Click, 它在 Accordion 内的页面中加载内容

Question

我当前创建了一个包含数据库信息的页面，该页面当前使用 php、javascript、jquery 连接到两个数据库。我需要使页面上传更快。我有一些信息立即显示，一些信息通过使用 Accordion /选项卡隐藏在页面上。我想做的只是加载首先显示的信息。当用户想要更多信息时，他们将单击折叠选项卡，然后信息才会在页面内上传(再次尝试节省上传时间)。

这是我的 Accordion 选项卡之一的示例...

    <div class='expand_container3' style='float:left; margin-top:10px; width:100%;'>
        <div class='expand_header3' style='width:100%; text-transform:uppercase;' > <span>+ Archives</span> </div><div class='expand_content3' style='width:100%; margin:auto;'>
            <table  class='license_table arch_tab' style='border:1px solid #222; width:100%;'>
                <thead>
                <tr>
                    <th>Archive Number</th>
                    <th>Arichive Date</th>
                    <th>Install Archive</th>
                    <th>Renewal Archive</th>
                    <th>Mailed Archive</th>
                </tr>
                </thead>
                <tbody>
                    <?php echo $archiverow ?>
                <tbody>
            </table>
        </div>
    </div >
    <script>
        $(".expand_header3").click(function () {

            $expand_header3 = $(this);
            //getting the next element
            $expand_content3 = $expand_header3.next();
            //open up the content needed - toggle the slide- if visible, slide up, if not slidedown.
            $expand_content3.slideToggle(500, function () {
                //execute this after slideToggle is done
                //change text of header based on visibility of content div
                $expand_header3.text(function () {
                    //change text based on condition
                    return $expand_content3.is(":visible") ? " -  Archives " : " +  Archives ";
                });
            });

        });
    </script>   

同样，我不希望在第一个页面加载期间上传内容，但是当他们单击折叠选项卡时，它会上传 div 中的内容。请帮忙。

Answer 1

您可以尝试使用每个选项卡的内容创建不同的文件，然后在每个选项卡链接的 onclick 事件上使用 jquery('#').load()，仅在选择选项卡时加载内容。

您使用的是旧版 php 还是 PHP 框架？哪个？