Javascript Django模板内联jQuery不工作

尝试在我的模板中使用内联jQuery，以便稍后在AJAX调用中使用django url标记。 但是我无法让javascript正常工作。在我的子页面中，我扩展了包含所有javascript和jQuery库的索引页面

{% extends "subpage.django" %}


{% block content %}
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>

    <script>
    $("#dialog").hide();
    $(".delete").click(function(){
            alert("clicked!");
     });  

    </script>

    {% if graph %}
        <h3> {{ graph.name }} </h3>
       {% url 'graphImage' graph.id as the_graph %}
        <img src="{{the_graph}}" alt="{{the_graph}}"/>



        <a class="button delete" id="{{ graph.id }}" href="#">Delete</a>


        <div id="dialog" title="Confirm delete">Are you sure?</div>


    {% endif %}
{# need to add object.id to dialog in javascript #}
{% endblock  %}

{%extensed“subpage.django”%}
{%block content%}
$（“#对话框”）.hide（）；
$（“.delete”）。单击（函数（）{
警报（“单击！”）；
});  
{%if图%}
{{graph.name}
{%url'graphImage'graph.id作为\u graph%}
你确定吗？
{%endif%}
{需要在javascript中向对话框添加object.id}
{%endblock%}

做了一些编辑。将脚本放入块内容中，以便在显示源代码时立即显示。但是仍然不起作用。 我现在使用GoogleAPI包含了jQuery源代码。但是内联脚本仍然不起作用。奇怪的是，如果我在控制台中键入它，它就可以完美地工作，只是不在这里！我知道我错过了什么

好吧，我解决了！ 我的第一个问题由用户PaulTomblin解决（很抱歉，我不知道如何添加您，而且我没有足够的代表投票支持您的评论）。我没有意识到我的子页面不会包含jQuery。出于某种原因，我认为它会继承这一点，但在本例中，Django不是这样工作的

其次，我没有添加$（document）.ready（function（）{}）；因此，当页面加载时，它不会“运行”或“初始化”脚本。 文档准备好运行JavaScript后，将运行document ready函数，如下所述：

这是我的最新代码：

{% extends "subpage.django" %}

{# once jQuery works, can do deleteGraph ajax requests #}

{% block content %}
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>
<script type='text/javascript'>
    $(document).ready(function(){
        $("#dialog").hide();
        $(".delete").click(function(){
            alert("clicked!");
        });
    });
</script>
    {% if graph %}
        <h3> {{ graph.name }} </h3>
       {% url 'graphImage' graph.id as the_graph %}
        <img src="{{the_graph}}" alt="{{the_graph}}"/>


        <a class="button delete" id="{{ graph.id }}" href="#">Delete</a>


        <div id="dialog" title="Confirm delete">Are you sure?</div>


    {% endif %}
{# need to add object.id to dialog in javascript #}
{% endblock  %}

{%extensed“subpage.django”%}
{#一旦jQuery工作，就可以执行deleteGraph ajax请求#}
{%block content%}
$（文档）.ready（函数（）{
$（“#对话框”）.hide（）；
$（“.delete”）。单击（函数（）{
警报（“单击！”）；
});
});
{%if图%}
{{graph.name}
{%url'graphImage'graph.id作为\u graph%}
你确定吗？
{%endif%}
{需要在javascript中向对话框添加object.id}
{%endblock%}

//  

您必须在每个页面上包括jQuery，而不仅仅是索引页面。我明白了，所以我不能只是从已经调用它的索引页面进行扩展！有道理。非常感谢你！是的，这很有效！我可以在开发者控制台的源代码中看到它。但是内联脚本仍然不起作用。我将编辑帖子以更新问题！您可以通过扩展一个基本页面来包含jQuery，但如果没有看到该页面，我们无法确定您可能在哪里出错。是的，使用了一个基本页面来扩展它。哇！3年后，我仍然记得如何解决这个基本问题哈哈。多好的旅程啊！

<script type="text/javascript" src="{% static 'mag/js/jquery-ui.js'%}"></script>

<script type='text/javascript'>//<![CDATA[ 
    $(window).load(function(){
    $( "#slider-range" ).slider({
        range: true,
        min: 0,
        max: 9000,
        values: [ 50, 6000 ],
        slide: function( event, ui ) {  
            $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
        }
    });

    $( "#amount" ).val( "$" + 
            $( "#slider-range" ).slider( "values", 0 ) + " - $" 
            + $( "#slider-range" ).slider( "values", 1 ) );

    });//]]>  

</script>