0

我在让倒数计时器在我的 jQuery 移动页面上工作时遇到了一些麻烦。如果我将它加载到静态 html 页面上，它应该可以正常工作（请参阅该页面：http://www.beingproperties.com/match-game）。当您点击开始游戏时，计时器开始。

我最近将它移植到了 jQuery 移动框架，但计时器在该站点上不起作用（通过转到链接并单击“多页链接，然后单击开始游戏链接”来查看此处）：http://www .beingproperties.com/match-game/home.html）。

我已经使用“pageshow”作为下面的场景进行绑定，虽然我让它工作并发出警报，但一旦我添加我的代码来执行，什么都没有发生。

$('#shapesPage').live('pageshow', function () {

我知道这是关于 ajax 加载页面的问题，尽管除倒数计时器之外的所有其他 jQuery 都会在此页面上触发。我很茫然，非常感谢朝着正确的方向踢球。

我使用了检查器，它的信息量不是很大。任何解决此问题的见解或调试这些类型问题的正确方法将不胜感激。提前致谢。-克里斯

4

1 回答 1

0

Looking at the source for home.html, it seems that you haven't included js/plugins.js, only js/index.js.

I know you've included it in shapes.html, but JQM is a bit weird about loading external scripts when loading a page via ajax, as stated in the documentation:

The simplest approach when building a jQuery Mobile site is to reference the same set of stylesheets and scripts in the head of every page. If you need to load in specific scripts or styles for a particular page, we recommend binding logic to the pageinit event (details below) to run necessary code when a specific page is created (which can be determined by its id attribute, or a number of other ways). Following this approach will ensure that the code executes if the page is loaded directly or is pulled in and shown via Ajax.

Edit: You can not call any functions that modify the DOM until it is fully loaded. This is signaled in JQM by the pageinit event. Read about scripting and events for more info.

Try surrounding your javascript for shapes.html with

$( document ).delegate("#shapesPage", "pageinit", function() {
  ...
});
于 2012-12-07T03:43:26.697 回答