1

我正在使用加载功能加载我的页面。该页面包含轨道滑块的初始化代码(我使用基础)。图像加载但滑块未初始化。

加载slider.html的代码

$("a#1").click( function () {
    $("#center_content").load("pages/slider.html");
});

slider.html 中的代码

<div class="row">
    <div class="four columns">Welcome</div>
    <div class="eight columns" id="featured">
        <img src="images/slides/1.jpg" alt="Overflow: Hidden No More" />
        <img src="images/slides/2.jpg"  alt="HTML Captions" />
        <img src="images/slides/3.jpg" alt="and more features" />
        <img src="images/slides/1.jpg" alt="Overflow: Hidden No More" />
        <img src="images/slides/2.jpg"  alt="HTML Captions" />
        <img src="images/slides/3.jpg" alt="and more features" />
    </div>
</div>
<script type="text/javascript">
     $(document).ready(function() {
         $('#featured').orbit();
     });
</script>
4

2 回答 2

2

取自文档

脚本执行

当使用没有后缀选择器表达式的 URL 调用 .load() 时,内容会在脚本被删除之前传递给 .html()。这会在脚本块被丢弃之前执行它们。但是,如果调用 .load() 时将选择器表达式附加到 URL,则脚本会在 DOM 更新之前被剥离,因此不会执行。

如果您需要在 html 中包含代码,我认为您不需要使用 $.ready(),因为脚本标记位于您尝试绑定的 html 之后。没有它它应该执行得很好。我猜您的代码不起作用,因为当 load() 函数解释脚本时,尚未插入 html。后来插入html的时候就没有代码可以执行了

于 2012-06-14T17:57:54.657 回答
2

我想这会有所帮助。完成后绑定轨道函数,load并在slider.html页面中移除绑定。

$(function(){
    $("a#1").click( function () {
        $("#center_content").load("pages/slider.html",function(){
             $('#featured').orbit();
        });
    });
});
于 2012-06-14T17:53:50.077 回答