jquery ajax加载后丢失css答案

【问题标题】：losing css after jquery ajax loadjquery ajax加载后丢失css
【发布时间】：2012-03-01 00:06:12
【问题描述】：

大家都知道如何在使用 $.load 的 Ajax 请求后解决 css 的问题吗？例如，如果我只想从网页加载一个 DIV，在我的 Ajax 请求之后：

$('container').load('path_to_div #div_id');

我丢失了与该 div 关联的所有 css 和脚本

有什么建议

【问题讨论】：

【解决方案1】：

是的，当内容被 AJAX 替换时，附加的任何事件处理程序都将断开连接。您可以使用 jQuery 的 .on() 或 .live() 作为替代事件挂钩来防止这种情况发生。

至于 CSS，您可能在原始内容上获得了替换内容中缺少的类名或 ID，或者替换内容与您在 CSS 中设置的选择器不匹配。

没有看到您的 HTML/CSS 就无法分辨。

【讨论】：

【解决方案2】：

将元素（及其子元素）的所有 CSS 包含在一个 CSS 文件中，该文件包含在您将加载它的主页中。因此，如果您有main.html，并且您正在将#div_id div 加载到该页面中，您需要在main.html 中包含#div_id 的CSS。

您还需要包含一个可以将事件处理程序委托给 AJAX 加载的内容的脚本，例如 .delegate()（适用于 1.7 之前的 jQuery 版本）或 .on()（适用于 jQuery 1.7+）。

【讨论】：

【解决方案3】：

我遇到了那个错误，解决方案是：

$('#contentPagina').load(nombrePagina,function(){ $('#contentPagina').trigger('create'); });

【讨论】：

【解决方案4】：

您可以像在this answer 中那样动态加载 CSS，或者将它们添加到您要加载 div 的页面的 CSS 文件中。

至于外部脚本，$.getScript() 应该会解决您的问题。

【讨论】：