在页面加载前在 ajax 个请求的页面上执行脚本

Question

我有一个基于 AJAX 的网站导航。一个是 index.html 另一个是 profile.html。两个页面的内容是这样的：

<html>
<head>
<script src="script1.js" type="text/javascript"></script>
</head>
<body>
<nav class="main-nav">.....{{nav-content}}.....</nav>
<div class"content">
---{{main-content}}-----
</div>
</body>

在这两个页面上，我都链接了网站上任何地方可能需要的所有脚本。在 profile.php 我有一个使用 $("div#mySliderTabs").sliderTabs();.

当我使用 .load() 加载 profile.php 的 <div class=".content"></div> 内容时，我必须手动执行 $("div#mySliderTabs").sliderTabs(); 作为 .load() callack 再次使 sliderTabs 工作。

有什么方法可以使 sliderTabs 工作而无需再次触发脚本并将生成的 html <div class=".content"></div> 内容仅加载到当前页面。

Answer 1

没有。据我所知，SliderTabs 需要一个 DOM 元素。这意味着它需要存在才能被实例化。不过还有其他选择

您可以加载新内容，将其保存在 jQuery 集合中并执行 sliderTabs() 而无需它在 DOM 中。然后你可以随时添加它。 sliderTabs() 仍然需要在您的 AJAX 调用之后执行。
sliderTabs 可以使用冒泡事件来实现——例如——点击事件。像这样：

__

$('document').on('click', '#sliderButton', function() {
    // do the sliding
});

即使之后加载了 AJAX，这些按钮也会有它们的事件侦听器。

在页面加载前在 ajax 个请求的页面上执行脚本

Execute script on ajax requested page before page loads

html

javascript

ajax

jquery