Question

这个example并没有完全显示问题，只是为了有个主意。例如，当我点击第2页时，内容未加载到div中，我必须刷新页面才能看到页面2的内容。

P.S：相同的代码在其他页面中重复。

代码：

$(document).ready(function() {
    $('.content-primary').html("Content of page 1"); // This line just in this example
    //$(".content-primary").load("content-of-page.php"); // but I used this code on all my pages 
});

Answer 1

这是一个常见的jQuery Mobile问题。

您不应该将文档准备好与jQM一起使用，而是jQM提供页面事件。您的问题是文档就绪，谁可以，并且通常在页面加载到DOM之前触发。这就是为什么刷新有帮助，此时页面已经加载。

我为你做了一个工作的例子：http://jsfiddle.net/Gajotres/8hKe2/

$(document).on('pagebeforeshow', '#foo', function(){       
    alert('This is foo');
});

$(document).on('pagebeforeshow', '#bar', function(){       
    alert('This is bar');
});

基本上每个页面事件都会触发仅适用于该页面的javascript代码。如果您希望代码只执行一次，则应使用pageinit事件而不是pagebeforeshow，如下所示：

$(document).on('pageinit', '#foo', function(){       
    alert('This is foo');
});

$(document).on('pageinit', '#bar', function(){       
    alert('This is bar');
});

如果您想了解更多，请查看我的其他文章/答案：https://stackoverflow.com/a/14469041/1848600

内容未使用jQuery mobile动态加载到DIV中

1 个答案: