Question

假设我在jQuery Mobile网站上有2个页面。

Page1 - 使用内联PHP显示数据库中的数据。

第2页 - 将新数据插入数据库。

问题是，在page2向数据库添加内容后，返回时page1不会更新。我可以通过按F5来更新它，但是如何使用jQuery实现相同的更新？

Answer 1

我认为您使用pageinit事件在第1页中显示数据。这将只触发一次，并且不会在每次添加新数据时更新您的数据。

您需要使用第1页的pagebeforeshow事件从数据库中获取数据。这样，每次都会带来新数据，这正是您所需要的。这是一种语法：

 $(document).on("pagebeforeshow", "#page1", function() {
      //call to server
 });

如果您未使用pageinit，则必须使用document.ready事件来获取数据。那就是那样做的方式。您不得将ready与jquery mobile一起使用。 DOM ready将初始化整个文档，这将使jQM的ajax页面更改功能毫无意义。无用的。

Answer 2

昨晚很晚，我错过了我应该使用Ajax获取内联php内容。

所以这就是我解决它的方法：

在一个单独的文件中使用PHP移动包含动态内容的所有内容。

将Ajax调用添加到加载PHP文件的页面底部，如下所示：

$(document).on('pagebeforeshow', function(){
    $.ajax({
         type: "GET",        
         url: "includes/db/ajax_show_php_content.php",       
         success: function(html) {
            $("#page1").html(html); //Insert PHP content
        $("#page1").trigger('create'); //Apply jQuery Mobile style to it.
    });                 
});

感谢@hungerpain和@anglinb帮助解决这个问题。

Answer 3

我对jQuery Moblie并不是非常熟悉，但这是我发现的：

function refreshPage()
{
   jQuery.mobile.changePage(window.location.href, {
        allowSamePageTransition: true,
        transition: 'none',
        reloadPage: true
    });
}

我认为reloadPage为true应该可以解决问题。

如果不起作用，请查看以下答案：jQuery Mobile Page refresh mechanism

希望这有帮助！

更新数据库后，在jQuery Mobile站点中更新动态PHP

3 个答案: