Django模板不执行js函数
Posted
技术标签:
【中文标题】Django模板不执行js函数【英文标题】:Django template not executing js function 【发布时间】:2011-11-05 07:07:15 【问题描述】:我有一个看起来像这样的 django 模板:
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js" type="text/javascript"></script>
<script src=" STATIC_URL js/jquery.flot.js"></script>
<!--<script src="c:/src/project/scraper/collegedata/templates/chart.js" type="text/javascript"></script>-->
<script src=" STATIC_URL js/chart.js" type="text/javascript"></script>
</head>
<body>
<div id="chart1" style="width:600px;height:300px"></div>
<script>
show_graph(" chart_type ", series_names , data , answer );
</script>
<form action="start">
<input type="submit" value="Back to Questions" />
</form>
</body>
</html>
其中 show_graph 是 chart.js 中的一个函数。但是,pycharm 给了我以下两个错误之一: 未解析的函数或方法 show_graph(),或 传递的参数数量无效:预期 4
而且该函数显然没有被调用。
我有点困惑,我什至是否可以将模板变量传递给 js 函数...
有人有什么见解吗?
编辑:
这会生成
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js" type="text/javascript"></script>
<script src="/static/js/jquery.flot.js"></script>
<!--<script src="c:/src/project/scraper/collegedata/templates/chart.js" type="text/javascript"></script>-->
<script src="/static/js/chart.js" type="text/javascript"></script>
</head>
<body>
<div id="chart1" style="width: 600px; height: 300px;"></div>
<script>
show_graph("pie", [<ResponseOption: puddentane>, <ResponseOption: down the lane>], [1, 0], 0);
</script>
<form action="start">
<input value="Back to Questions" type="submit">
</form>
</body></html>
chart.js 的样子(值临时硬编码以进行故障排除,应该提到 $.plot 也给出了未解决的函数错误):
function show_graph(charttype, series_names, data, answer_index)
var data = [2000, 50, 400, 200, 5000];
var data3 = [
label: "my cat", data: 10, color: 'rgb(85, 96, 42)',
label: "my friends", data: 20, color: 'rgb(105, 118, 52)',
label: "my boyfriend", data: 30, color: 'rgb(125, 141, 62)',
label: "my job", data: 30, color: '#42215F',
label: "food", data: 10, color: 'rgb(145, 164, 72)',
label: "social skills", data: 0, color: 'rgb(166, 189, 82)'
];
alert("in chart.js");
var charttype = "pie";
var type = ;
type[charttype] = show: true;
var chart_options = ;
chart_options["series"]=type;
var plot = $.plot($("#chart1"), data3, chart_options);
【问题讨论】:
这段代码生成的标记是什么样的? (在浏览器中查看源代码) 第二次需要显示源代码 - 具体来说,粘贴生成的show_graph
行。
【参考方案1】:
看起来 series_names
只是作为对象的 HTML 实体输出,而没有适当的 __unicode__
方法。你得到:
show_graph("pie", [<ResponseOption: puddentane>,
解码后是:
show_graph("pie", [<ResponseOption: puddentane>, ...
实际上需要传递给方法的是什么?您可能需要考虑如何输出 series_names
,而不仅仅是调用该变量的字符串表示形式。您目前生成的是无效的 Javascript - 您的浏览器控制台可能会加强这一点。
【讨论】:
我稍后会解决这个问题,谢谢。但是,目前,我实际上并没有使用 series_names——我已经硬编码了这些值,但它仍然无法正常工作 这无关紧要。[&lt;ResponseOption: puddentane&gt;,
和 [<ResponseOption: puddentane>,
都是无效的 JavaScript,不应该存在。如果您不使用它们,请将 series_names
替换为[]
。
Sam 和 Mike 是赢家:无效的 javascript 阻止了代码运行。谢谢!【参考方案2】:
参数数量无效意味着您的上下文变量之一(可能是answer
)为空白。
您的代码是有风险的,因为 Django 会将您的上下文变量转义为 HTML 安全,而不是 JavaScript 安全。我用来解决这个问题的一个技巧是将所有参数放入字典中的 JS 函数,然后将其转换为 JSON 并将其用于上下文变量(将其与 |safe
过滤器和 <![CDATA[
标记一起使用如果需要,在模板中)。
至于show_chart
未被解析,您可能需要确保chart.js
确实正在加载,并且它不在某种形式的命名空间中。
【讨论】:
我将如何检查chart.js 是否真的被加载了?这很可能是这里的问题。 在浏览器中使用调试工具。在 Firefox 中,安装 Firebug 并将其打开。在 Safari 中,启用首选项中的开发人员菜单。有一个资源选项卡或等效选项卡,显示为页面加载的每个内容和任何状态代码。以上是关于Django模板不执行js函数的主要内容,如果未能解决你的问题,请参考以下文章