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”）触发的标签小部件.slipTabs（）; 。

当我使用 .load（）加载profile.php的<div class=".content"></div>内容时，我必须手动执行 $（“div＃mySliderTabs”）。sliderTabs（）; < / strong>再次使用 .load（）callack 使sliderTab工作。

有没有办法让sliderTabs在不再触发脚本的情况下工作，并将生成的html <div class=".content"></div>内容加载到当前页面中。

Answer 1

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

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

__

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

即使他们之后加载了AJAX，按钮也会有他们的事件监听器。

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

1 个答案: