JQuery在Django自定义模板中不起作用

Question

我正在创建一个简单的自定义模板，它在调用时呈现自己的模板。问题是这个模板上的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 templatetag

@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>

模板的模板确实在加载，因为文本全名显示在屏幕上，但没有加下划线。如果我将相同的JQuery放在父模板中，那么全名就会带有下划线。

这里发生了什么事？当脚本在父类中时，它喜欢这个JQuery，但是当脚本驻留在呈现_样式的模板上时，它不喜欢这个脚本。

Answer 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>