jQuery Mobile脚本未在DOM缓存页面上加载

时间:2013-12-12 21:53:00

标签: jquery ajax jquery-mobile dom caching

我真的希望有人可以帮我解决这个问题。我一直在试验jQuery Mobile并遇到了一个问题。问题是关于一个名为Swipebox的jQuery灯箱。插件本身可以正常工作,所以当它不起作用时我会突出显示

CSS和脚本位于我的文档的头部。调用脚本位于正文内部,但位于标记内。

唯一不起作用的是页面本身作为“第一页”。在初始加载时,它可以工作。但是如果我离开那个页面并通过AJAX加载返回,那么插件就会停止工作。

我目前对jQuery Mobile的了解并不多,但我假设第一次加载“第一页”(或者可能刷新)时,它会被缓存。因此,当从另一页返回第一页时,加载时间是即时的。但不幸的是,它似乎完全破坏或不包括脚本。

是否有人能够指出我正确的方向。我的标记的基本布局如下。任何建议将不胜感激

<!DOCTYPE html> 
<html>
<head>
<title>Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">    

    <link rel="stylesheet" href="/templates/assets/css/mobile/swipebox.css" />
    <script src="/templates/assets/js/mobile/jquery.swipebox.js"></script>
</head> 

<body>

<div data-role="page" class="padded-bottom" data-dom-cache="false">

<section data-role="content">


<!--Gallery images-->


</section><!--content-->


<script>
$(".swipebox").swipebox({hideBarsDelay : 0});
</script>

</div><!-- page -->

</body>
</html>

目前我在“模板1”中有以下内容

<script>

$('#hotel').on('pageload', function() {
$(".swipebox").swipebox({hideBarsDelay : 0});
$(".test").text("jQuery works");
});

</script>

这是'模板2'

<script>

$('#hotel-view').on('pageinit', function() {
$(".swipebox").swipebox({hideBarsDelay : 0});
$(".test").text("jQuery works");
});

</script>

这使得插件在“模板2”上完美运行,无论其加载方式如何。但该插件也用于'模板1'。在“内幕”标签下。看来插件无法在两个页面上完美运行。问题已经取得进展而不是已经解决了:)

0 个答案:

没有答案