4

这是我目前的设置。

我在 jquery 移动框架上运行了两个页面。

  • 索引.php
  • 文章.php

在麻烦的标题中，我有一个名为 rating.js 的 js 文件。

这是我的js ratings.js：

$(document).ready(function(){
    $("#rating_1").click(function () {
        $("#rating_2").css('backgroundPosition', '0px 0px');
        $(this).css('backgroundPosition', '-45px 0px');
    }); 
});

当我加载index.php然后去article.php我的触发器都没有ratings.js工作时。

如果我添加rel="external"或data-ajax="false"我的触发器工作。然而，我失去了让我的装载机轮子上来的能力。

有什么建议么？

谢谢！

4

3 回答 3

3

重要提示：使用$(document).bind('pageinit')，而不是 $(document).ready()

在 jQuery 中学习的第一件事是调用 $(document).ready()函数内部的代码，以便在加载 DOM 后立即执行所有内容。但是，在 jQuery Mobile 中，Ajax 用于在您导航时将每个页面的内容加载到 DOM 中，并且 DOM 就绪处理程序仅针对第一页执行。要在加载和创建新页面时执行代码，您可以绑定到 pageinit 事件。此事件在本页底部有详细说明。

尝试：

$(document).bind('pageinit', function() {
    $("#rating_1").click(function() {
        $("#rating_2").css('backgroundPosition', '0px 0px');
        $(this).css('backgroundPosition', '-45px 0px');
    }); 
});
于 2012-06-17T05:01:07.947 回答
2

你应该把所有东西都放在里面：

<div id="page" data-role="page">
<!--here-->
</div>

<head></head>加载 ajax 时不会加载该部分中的脚本。

于 2012-06-17T03:28:35.277 回答
2

问题是 jQuery 通过 Ajax 加载页面，因此它只加载

<div data-role="page"> </div>

页面的一部分。

您可以做 3 件事来解决此类问题。

1.）您已经尝试过的那个（即制作 data-ajax=false ）使您的页面再次完全加载并且不显示加载轮。

2.) 您可以将活动设为现场活动：

$("#rating_1").live('click', function () {
$("#rating_2").css('backgroundPosition', '0px 0px');
$(this).css('backgroundPosition', '-45px 0px');
});

这将使它寻找任何新的#rating_1 并将点击事件添加到它。

3.)$(document).ready你可以使用$( '#myPage' ).live( 'pageinit',function(event){};函数而不是使用。

于 2012-06-17T04:08:53.340 回答