Question

好吧，我有一个api从中获取数据，然后将数据放入一个数组中，然后将数据放在一个html页面上供用户滚动浏览。所有工作正常。

我想知道我现在如何才能将前10个结果放到页面上，然后从阵列中自动重新加载。我见过那些使用mysql但是从数组中获取数据仍然困扰着我。

欢迎任何帮助。

$url = 'API';
$ch = curl_init();
curl_setopt($ch, CURLOPT_U`enter code here`RL, $url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);

curl_setopt($ch, CURLOPT_HTTPAUTH, CURLAUTH_BASIC);
$output = curl_exec($ch);
$info = curl_getinfo($ch);
curl_close($ch);


$echo_array = $array['jobs'];
usort($echo_array, function($a, $b) {
    return strtotime($a['einsatzstartdatum']) - strtotime($b['einsatzstartdatum']);
});
// print_r($echo_array);


foreach ($echo_array as $job)
{
    //echo "Id:". $job['ID'] ."\n";
    echo "Town:". $job['einsatzort'] ."\n";
    echo "stellentitel:". $job['stellentitel'] ."\n";
    echo "einsatzstartdatum:". $job['einsatzstartdatum'] ."\n";
    echo "bewerbunganlagenbenoetigt:". $job['bewerbunganlagenbenoetigt'] ."\n"."\n"."\n";

};

Answer 1

如果只是关于显示，我会把内容放在一个包含所有php行的javascript数组中。

当内容到达底部时，用滚动事件更新内容。

这是我做的一个小例子，让我知道如何去做：（请记住，这是基于您一次加载所有数据的想法）

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

<script type="text/javascript">

    //fill a javascript arr with all your content
    var dummyContentArr = new Array();

    var limit = 10;

    //just for the example some dummy data
    for(var i = 0; i < 100; i++) {
        var dummyContent = 'town: yada ' + i +  '"\n"' + 
        'stellentitel: test ' + i + '"\n"' +
        'einsatzstartdatum: test ' + i + '"\n" ' +
        'bewerbunganlagenbenoetigt: test ' + i + '"\n"';
        dummyContentArr.push(dummyContent);
    }

    $(document).ready(function() {
        displayContent(10);

        //this scroll event will will update the limit when the scroll bar hits the bottom
        $('#content').on('scroll', function() {
            if($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) {
                displayContent(limit);
                limit += 10;
            }
        });

    });

    //just a simple function thingy to update the content
    function displayContent(limit) {
        content = '';
        for(i = 0; i < limit; i++) {
            content += dummyContentArr[i]; 
        }
        $('#content').html(content);
    }
</script>

<style>
    #content {
        background-color: red;
        height: 200px;
        width: 200px;
        overflow-y: scroll;
    }
</style>


<div id="content"></div>

当用户从api

1 个答案: