models.py

Question

我正在执行django的小任务，我将一些JavaScript部分用于无限滚动，

这是我的html文件的一部分。

{% for d in data reversed %}
<form method="POST" action="/SNS/{{d.id}}/">
{% csrf_token %}

<li>
<h5>{{d.content}}</h5>
<p>
    {{d.date}}
    <button type="submit" name="delete" value="delete">X</button>
</P>
</li>
</form>

{% endfor %}

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="script.js"></script>

<script type="text/javascript">
    var d = "{{data}}";
    $(window).scroll(function() {
        if($(window).scrollTop() == $(document).height() - $(window).height()) {
            alert('End of Window');


        }
    });

</script>

数据来自视图，并且在html部分中运行良好。

但问题是：

我想在我的脚本部分使用数据变量。

所以我声明var d那样，但它没有用。

如何在JavaScript中使用django中的var？

编辑：我最想做的就是像Twitter一样的无尽卷轴。

data在db中，并且首先加载其中一些页面。

当用户向下滚动页面时，页面会加载一些剩余的data ..等等。

我编写了用于向下滚动事件的代码，我需要显示剩余的data

Answer 1

您尝试的方法适用于字符串和整数等简单数据，但不适用于更复杂的数据类型，如列表和字典。这些需要使用 JSON过滤器转换为JavaScript对象。

如果您将用户提供的数据传递给JavaScript，这也会给跨站点脚本（XSS）攻击带来安全风险。我建议您在Django问题跟踪器上阅读this discussion，在那里他们谈论它（包括一些示例XSS漏洞代码），以了解您何时以及如何使用它。

您可以使用Python中的json模块将数据转换为JSON，然后将数据传递给模板：

template.render(Context("data": data, "jsdata": json.dumps(data)))

或者您可以使用扩展来过滤模板中的JSON，而不是将数据传递两次。

Answer 2

您可以将模板分为简单请求和ajax调用。例如：

查看功能：

from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger

def datalist_ajax(request):
data = Data.objects.all().order_by('created')
per_page = 1
paginator = Paginator(data,per_page)
if request.is_ajax():
    current_page = request.GET.get('page',1)
    try:
        data = paginator.page(current_page)
    except PageNotAnInteger:
    # If page is not an integer, deliver first page.
        data = paginator.page(1)
    except EmptyPage:
    # If page is out of range (e.g. 9999), deliver last page of results.
        data = None
    return render(request,'data/list_ajax.html',{'data':data})
else:
    return render(request,'data/list.html',{'data':paginator.page(1)})

<强> list_ajax.html：

{% if data %}
     {% for d in data reversed %}
      <li>
       <form method="POST" action="/SNS/{{d.id}}/">
        {% csrf_token %}

        <h5>{{d.content}}</h5>
        <p>
            {{d.date}}
            <button type="submit" name="delete" value="delete">X</button>
        </P>

        </form>
      </li>
    {% endfor %}
{% else %}
    That is all
{% endif %}

<强> list.html：

    <ul class="data-list">
        {% for d in data reversed %}
      <li>
        <form method="POST" action="/SNS/{{d.id}}/">
        {% csrf_token %}


        <h5>{{d.content}}</h5>
        <p>
            {{d.date}}
            <button type="submit" name="delete" value="delete">X</button>
        </P>

        </form>
      </li>
        {% endfor %}
    </ul>

        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
        <script src="script.js"></script>

        <script type="text/javascript">
            var current_page = 1;
                $(window).scroll(function () {
                    if ($(window).scrollTop() == $(document).height() - $(window).height()) {
                        current_page += 1;
                        $.ajax({
                            method: 'get',
                            url: '/data/',
                            data: {
                                'page': current_page
                            }
                        }).done(function (data) {
                            $('.data-list').append(data)
                            console.log(data);
                        });
                    }
                });

        </script>

list.html 中的

可以扩展任何其他“父”模板。在 list_ajax.html 中，您无需对其进行扩展。

Answer 3

这是我通常做的事情：

models.py

class MODEL(models.Model):
    field1 = models.CharField()
    field2 = models.TextField()
    field3 = models.DateField()

    def as_dict(self):
        return {'id':self.id, 'field1': self.field1, 'field2': self.field2, 'field3': self.field3}

views.py

import json
from django.core.serializer.json import DjangoJSONEncoder

#... inside some view ...
    context = {}
    json = [ q.as_dict() for q in SOMEQUERYSET ]
    context['json'] = json.dumps(json, cls=DjangoJSONEncoder)

HTML中的Javascript

var d = {{json|safe}};

如何在javascript部分中使用django模板变量？

3 个答案:

models.py

views.py

HTML中的Javascript