当我将 HTML 放入“包含”中时，为啥我的 javascript 不起作用？

Posted 2023-02-24

【中文标题】当我将 HTML 放入“包含”中时，为啥我的 javascript 不起作用？

【英文标题】：How come my javascript doesn't work when I put my HTML in an "include"?当我将 HTML 放入“包含”中时，为什么我的 javascript 不起作用？

【发布时间】：2011-05-23 06:10:15

【问题描述】：

% include "abc.html" %

在 Django 中，我将我的 html 放入其中。

现在，我的 javascript 将无法工作。

$(function()
   alert('hi');
   $(".div_inside_abc").css("background","#000");

);

我什至尝试将这个 javascript 放在 abc.html 中（在顶部）。还是不行。

当我这样做时：

$(".div_inside_abc").each(function(e)
    document.write($(this).attr("data-rel"));
);

我明白了：

p.grid_image_ur lp.grid_image_ur lp.grid_image_ur lp.grid_image_ur lp.grid_image_ur lp.grid_image_ur l

这不正常！当我“包含”某些东西时，就好像 Django 的模板没有呈现。

【问题讨论】：

是否正确引用了 jQuery？

你有div_inside_abc类的元素吗？

您应该发布生成的 HTML。这将极大地帮助您和我们发现问题。

你应该使用 Firefox/Firebug 来解决浏览器内的 JS 问题。

【参考方案1】：

如果您将 JavaScript 代码放入 HTML 中，它将不会执行（或者是有效的 HTML）。如果您打算这样做（我不建议这样做）或作为 DOM1 属性，则必须将其包装在 SCRIPT 标记中。

如果您希望 jQuery 在加载时运行此函数，我建议在 jQuery 之后加载的外部引用的 JavaScript 文件中执行此操作，

$(document).ready(function() 
    alert('hi');
    $(".div_inside_abc").css("background","#000");
);

或将其内联添加为，

<script language="javascript">
    $(document).ready(function() 
        alert('hi');
        $(".div_inside_abc").css("background","#000");
);
</script>

在 jQuery 包含之后。

如果您希望对其进行任意评估，我建议以这种方式直接调用该函数（如果您需要范围）

(function()
    alert('hi');
    $(".div_inside_abc").css("background","#000");

)();

【参考方案2】：

在 abc.html 中将 p.grid_image_url 更改为 p.grid_image_url 。可能不是，但这是一个好的开始。该页面一定抛出了一个由于某种原因你看不到的错误。