JQuery 在 Django 自定义模板标签的模板中不起作用答案

【问题标题】：JQuery doesn't work in Django custom templatetag's templateJQuery 在 Django 自定义模板标签的模板中不起作用
【发布时间】：2014-06-27 22:18:36
【问题描述】：

我正在创建一个简单的自定义模板标签，它在调用时呈现它自己的模板。问题是这个模板标签模板上的 JQuery 不起作用，我不知道为什么。

父模板

<head>
    <script type="text/javascript" src="{{ STATIC_URL }}js/jquery.js"></script>
    <script src="//code.jquery.com/jquery-1.9.1.js"></script>
    <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
</head>
<body>
    {% render_style %}
</body>

render_style 模板标签

@register.inclusion_tag('TEST.html')
def render_style():
    return

TEST.html

<head>
    <script type="text/javascript">
        $(document).ready(function(){
            $("#name").css("text-decoration","underline");
        });
    </script>
</head>
<body>
    <h2 id="name">FULL NAME</h2>
</body>

templatetag 的模板确实正在加载，因为文本 FULL NAME 显示在屏幕上，但没有加下划线。如果我将相同的 JQuery 放在父模板中，则 FULL NAME 将变为下划线。

这里发生了什么？当该脚本位于父类中时它喜欢 JQuery，但当脚本驻留在 render_style 的模板上时它不喜欢它。

【问题讨论】：

等等...你是在另一个<body>中渲染<head>和<body>吗？
我认为那是我在尝试任何事情让它发挥作用。如果我删除它们，一切都不会改变。
您的控制台有错误吗？
什么都没有。我所有的样式表和没有打开的东西和萤火虫的控制台没有显示任何错误。
你有 DOCTYPE 吗？如果不将其显式设置为 HTML 5，您的浏览器可能会在没有 type 属性的情况下执行 jQuery <script> 标签，例如 type="text/javascript"。

标签： javascript jquery django templates

【解决方案1】：

我猜测模板代码正在事件处理程序中执行。

所以你的代码给ready事件添加了一个事件监听器，这个事件已经执行了一次，不会再执行了。

所以尝试移动 $("#name").css("text-decoration","underline"); 在#name标签下，去掉ready事件，看看它是否有效。

例子：

<h2 id="name">FULL NAME</h2>
<script type="text/javascript">
        $("#name").css("text-decoration","underline");
</script>

【讨论】：

当你删除 ready 事件时，确保脚本是在 #name 之后添加的，否则它会在 #name 存在之前尝试选择它。