Question

我一直在寻找这样的东西，但我找不到一个好的解决方案。我有一个有3个表的页面。每个表使用CURL来拉取json信息并逐个填充表格。每个表都位于index.php页面上的不同php文件中。页面按文件的顺序加载，有时可能需要一段时间，具体取决于它所提取的数据量....我想在每个表的顶部放置一个加载图像或者如果可能的话进度条/直到他们完全加载...我成功的唯一解决方案是使用JavaScript和整个页面的加载图像....我需要每个部分单独....这是我的结构的一个例子。

<?php // index.php
include 'table_1.php'; // loads json into table
include 'table_2.php'; // loads json into table
include 'table_3.php'; // loads json into table
?>

Answer 1

有些方法可以在不使用javascript的情况下执行此操作，但我不会推荐它们，因为它们会对用户体验产生负面影响。

理想的设置是您设置3个在页面加载上运行的ajax请求，这些请求命中新端点，该端点只返回这些表的视图。默认情况下，将＃table_1的内容设置为微调器。

这是一个例子，只要你有jQuery可用：

的jQuery

public static ArrayList<String> computeAllPossiblePermutations(String str) {
    ArrayList<String> perms = new ArrayList<>();
    if (str.length() == 1) {
        perms.add(str);
    } else {
        String chr = str.substring(0,1);
        String rest = str.substring(1);
        ArrayList<String> subPerms = computeAllPossiblePermutations(rest);
        for (String s : subPerms) {
            for (int j = 0; j <= s.length(); j++) {
                String newPerm = s.substring(0,j) + chr + s.substring(j);
                perms.add(newPerm);
            }
        }
    }
    return perms;
}

HTML

$(document).ready(function() {
    $.get("table_1.php", function(data) {
       $("#table_1").html(data); 
    });
});

Answer 2

删除表脚本包括index.php 然后从每个table_1脚本的末尾返回任何预先确定的值 table_n_end ，并在Javascript代码中，比较这些值。
示例：
table_1.php

<?php
//... 

//At the end return an predetermined value as
echo "table_1_end";

用index.php加载JS

//call to Ajax to load table_1.php
    //put a loading image
    if (res1 =="table_1_end") then
        //call to Ajax to load table_2.php
           //put a loading image
           if (res2 =="table_2_end") then 
                //call to Ajax to load table_3.php
                    //put a loading image
                    if (res3 =="table_3_end") then          
                       //Sucess  
                    //end if table_3
                // end Ajax for load table_3  
            // end if table_2  
        //end Ajax for load table_2  
    // end if table_1   
// end Ajax for load table_1

小心使用＆＃34; Callback Hell＆＃34; 。但任何最好的方法是在Javascript中使用 Promises 。

加载图标或进度条，而Curl在PHP中加载json

2 个答案: