Question

我正在研究Django项目。我想将Django的views.py中的数据传递给javascript文件，运行js函数然后将返回值传递到我的html页面。我没有在这个项目中使用表格。有人可以指导我如何处理这个问题吗？我在这里看到的大多数答案目前已经过时，我尝试了不同的方法，没有运气。我使用的是Python v2.7。先感谢您！

Answer 1

如果您的项目使用Jinja或其他一些模板引擎，您可以尝试将数据传递到模板中。

在Writing your first Django app, part 3找到这个位并稍微调整一下。

def index(request):
    template = loader.get_template('app/index.html')
    my_data = ['whatever your data is']
    context = {
        'my_data': my_data,
    }
    return HttpResponse(template.render(context, request))

在index.html中

<html>
    <head>
        // import jQuery
    </head>
    <body>
        <div id='my_data_label'></div>
        <script type="text/javascript">
            var my_data = "{{ my_data }}"; // gets set by jinja
            $('.my_data_label').text(my_data);
            // do whatever with the data
        </script>
    </body>
</html>

不确定这是否正是您正在寻找的，但希望它有所帮助。

Answer 2

将javascript数据直接呈现在页面模板上的<script>标记内可能是个好主意。如果要在多个页面中使用它，请确保将其包含在基本模板中或使用include进行导入。

您的观点可能类似于标准的django视图：

def detail(request, poll_id):
    try:
        p = Poll.objects.get(pk=poll_id)
    except Poll.DoesNotExist:
        raise Http404("Poll does not exist")
    return render(request, 'polls/detail.html', {'poll': p})

模板会有一些额外的逻辑来构建javascript对象：

<script>
var questionset = {
    {% for q in poll.question_set %}
        q.id : {
            "title": "{{ q.title }}",
            "score": {{ q.score }}
        }
        {% if not loop.last %},{% endif %}
    {% endfor %}
}
</script>

现在，您可以在模板中使用javascript对象，该对象可以从数据中动态构建。您可以随意使用它：

<script>
    function doSomething(questionset){
        ...
    }
</script>

有一些方法可以将数据保存到javascript文件中，但请记住，这会被客户端的浏览器缓存。拥有动态数据并不是一个好主意。

Answer 3

我建议json_script

这里是一个例子。我在views.py

中的代码

def countymap(request):
    json_data = open('home/static/GEOJSON/NECounties2.geojson')
    countyData = json.load(json_data)
    return render(request, 'home/Countymap.html',
                  {'countyData': countyData})

在我的HTML上，我使用json_script获取数据并为其分配ID。此外，还有一个单独的Javascript文件（我们称其为Countymap）

<html>
blah blah blah
{{ countyData | json_script:"county-data" }}
<script type="text/javascript" src='{% static "js/Countymap.js" %}'></script>
<html>

在Countymap javascript中，使用它来获取数据

var countyData = JSON.parse(document.getElementById('county-data').textContent);

希望它仍然有帮助

如何将Django数据传递给外部JS文件？

3 个答案: