缺少变量值时 Django 模板中的 Javascript 语法错误

Posted 2023-02-24

【中文标题】缺少变量值时 Django 模板中的 Javascript 语法错误

【英文标题】：Javascript syntax error in Django Template when variable value is missing

【发布时间】：2017-09-18 03:15:46

【问题描述】：

我有一个带有 AJAX 菜单的 Django 模板（单击不同的菜单项会重新加载页面的一部分）。每次菜单点击都会通过 AJAX 调用一个 Django 视图函数，并返回一些数据以显示在页面上。

我只在主页中加载所有菜单项所需的所有 JS（因为我了解到 AJAX 在 <div> 中返回 JS 然后使用 eval() 执行它不是一个好主意)。由于我仅在菜单的主页上加载所有 JS，因此在开始时其他菜单选项的数据显然不存在，因为它会在稍后调用相应的视图时（单击菜单选项时）出现

因此，像下面这样的代码在控制台上会出现语法错误，因为 JS 只在第一次被解析。

<script> var data = se_data|safe; </script>

现在我无法使用从视图返回的数据，即使在我单击菜单选项之后，因为 JS 解析首先失败了。我尝试使用if 仅在选择相应的菜单选项时执行代码，但这也不起作用，因为解析器只解析所有内容。

我一直在尝试不同的方法来解决这个问题，但似乎找不到解决这个问题的有效方法。另一种方法是让视图函数首先返回所有数据，但我担心菜单选项和返回的数据可能会随着时间的推移而增长，从而延迟主菜单页面的初始加载。

这是ajax菜单的点击功能：

$(".ent-menu li a").click(function(e) 
    e.preventDefault(); // prevent from going to the page mentioned in href
    // get the href
    var href = $(this).attr("href");

    $("#data_container").load(href, function() 
        load_data(); //this function uses the data variable defined earlier
    );
);

加载菜单主页时在控制台中看到的错误：

Uncaught SyntaxError: Unexpected token ;     at line 1110
data = ;

因为数据尚不可用。

【问题讨论】：

如果第一次加载时永远不会有任何数据，那么var data = se_data|safe; 行的意义何在？为什么要拥有它？

因为稍后点击相应的菜单选项时我需要数据。由于菜单点击是一个 AJAX 调用，如果我在那里返回 js，那么我将不得不去 eval() 路由来执行它，我猜这被认为是不安全的

这没有意义。你的问题说一开始不会有任何数据。无论如何，稍后的 Ajax 调用将返回该数据。 （另外，我不明白你对eval 的意思；数据是由Ajax 调用返回的，你不需要评估它。）

我的意思是我需要 js 将返回的数据分配给一个 js 变量。 Ajax 返回数据，但我需要将其分配给 js 变量才能使用它。该任务将需要 javascript，因此需要 eval()?

为什么？大概是 JSON（如果不是，为什么不呢？）所以你应该使用JSON.parse()。

【参考方案1】：

如前所述，您应该使用 JSON 将数据从 Python 发送到 JS；使用JSON.parse() 反序列化数据以供在您的 JS 中使用。

【讨论】：

我现在正在使用 JSONResponse 来获取数据，但我意识到一个权衡是现在我必须使用两个 AJAX 请求（一个用于获取该菜单选项的模板（带有 html），另一个获取 JSON）。理想情况下，我可以通过在视图中将 JSON 作为上下文发送到 render() 中来将两者结合起来，但随后我将无法解析它，因为模板变量将在 AJAX 返回的 HTML 中的 <div> 中可用（不会评估JSON.parse() 除非我使用 eval())。你同意吗？