0

私は個人的なプロジェクトのためにDjangoとJavascript/jQueryを学ぼうとしています。Flotを使用していくつかのデータをプロットしたいのですが、テストプロットを取得してレンダリングしようとしていますが、間違っているようです。

私の要素base.htmlには、jQueryとFlotの両方を含めるために次のものがありますhead。

<script src="/site_media/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="/site_media/jquery.flot.min.js" type="text/javascript"></script>

私の中でinherit.html：

{% extends 'base.html' %}

<script type="text/javascript">
alert('Im running!');
$.plot($("#flot-test"), [ [[0, 0], [1, 1]] ], { yaxis: {max: 1 } });
</script>
{% block title %}Detail View for {{ sched_name }}{% endblock %}

{% block content %}
<div id="status_bar">
    <a href="/view_schedules/">{{ user.username }}'s Gradebooks</a> / <a href="/view_schedules/{{ schedule_slug }}/">{{ sched_name }}</a>
</div>

<div id="flot-test" style="width:600px;height:300px">
</div>

The rest concatenated

ただし、Djangodevを使用してページをレンダリングすると。サーバー私が含めたようなアラートは表示されず、プロットはレンダリングされません。指定した寸法の空白のdivを取得します。Webブラウザーでページのソースを実際に見ると、上記に含めたプロットスクリプトも表示されません。私は何が間違っているのですか？

4

1 に答える 1

1

JSは、ターゲットdivがレンダリングされる前に実行されています。インラインJSの前にdivを移動するか、JS呼び出しをdocument.readyでラップすることができます。

<script type="text/javascript">
$(document).ready(function(){ 
    alert('Im running!');
    $.plot($("#flot-test"), [ [[0, 0], [1, 1]] ], { yaxis: {max: 1 } });
});
于 2012-05-26T16:17:23.010 に答える