4

ユーザーがページの最後に到達したときに、新しいコンテンツを動的にロードしようとしています。私の Web アプリは gae-python を使用しています。ajax と jquery を使用して、html のクエリを更新します。

HTML :

{% block content %}

<div class="hero-unit special-padding">
  {% for h in hots %}
    {{ h.imageid.get().render() | safe }}

  {% endfor %}

{% include 'pager.html' %}
 </div>
{% endblock %}

Jquery & AJAX:

  $(window).scroll(function () {
     if ($(window).scrollTop() + $(window).height() > $('.hero-unit').height() - 100 && !isLoading) {$('#loadpage').click(function() {
        var page=$('#loadpage').attr('name');
        $.ajax({
            type: "POST",
            dataType:"json",
            url: '/loadpage', 
            data : {'page': page}, 
            success: updatehtml,  
        });
        return false;
        });
                    });

    function updatehtml(e){
        for (var i = 0; i < e.length; i++) {
            var html= "{{ "+e[i]['imageid']+".get().render() | safe }}";
            $('.hero-unit').append(html);
        }
    }

データストア エンティティをシリアル化し、json として渡します。HTMLを更新します

{{ datastoreKey.get().render()|safe }}

今.render()、ajaxがHTMLを更新するたびに、jinja2フレームワークがpython関数を呼び出すようにします。

HTMLコード全体をjavascriptで書くことで代替できることは知っていますが、他に簡単で良い方法があるかどうか知りたいです。

4

1 に答える 1

1 
function updatehtml(e){
        for (var i = 0; i < e.length; i++) {
            var html= "{{ "+e[i]['imageid']+".get().render() | safe }}";
            $('.hero-unit').append(html);
        }
    }

誰かがあなたの URI を要求したときに一度だけレンダリングされます。

そのため、ラインvar html= "{{ "+e[i]['imageid']+".get().render() | safe }}";がレンダリングされ、ポルプスへの無効なレンダリングが含まれます。

そのためには、lodapage ハンドラーから html で応答する必要があります。html= "{{ "+e[i]['imageid']+".get().render() | safe }}";を loadpage ハンドラに「移動/採用」し、単純なテンプレート ファイルまたはインラインでレンダリングして、html 応答にします。AJAX リクエストは html 形式のデータを取得できるため、簡単に追加できます。id には注意が必要であり、html に依存するのではなく、モデル/id に依存して、重複などを避ける必要があります。

eその後、引数から簡単に取得できるhtmlを追加できます

于 2013-01-05T13:53:16.883 に答える