动态内容不加载与jquery移动

我有以下代码为jquery移动页面。当我直接运行它时，它可以工作，但是当我从不同的页面链接到它时，它不会加载。我试过在推荐链接中关闭数据ajax，但这没有什么区别。有任何想法吗？动态内容不加载与jquery移动

这里是代码：

var urlQuery = location.search; 
urlQuery = urlQuery.replace('?', ''); 
var split = urlQuery.split('='); 
var id = split[1]; 

$(document).delegate('[data-role="page"]', 'pageinit', function(){ 
    $.get('../ws/bars.php?id=' + id, function(data) { 
     $('[data-role="content"]').html(data); 
     $('[data-href="specials"]').trigger('click'); 
    }); 
}); 


$(document).delegate('[data-role="navbar"] a', 'click', function(event){ 
    $('.content_div').hide(); // hide all the .content_div's 
    $('#' + $(this).attr('data-href')).show(); // display the div that's been clicked $('a.pageTab').removeAttr('style'); // remove styling from the buttons 
    $(this).attr('style','color: #eee;'); // add styling to the active button 
});

无论答案我从这个搞定了，请给我的，为什么还有什么让我能明白是怎么回事。

谢谢！

来源

2012-03-21 Justin White

您的初始$.get()函数调用似乎在全局范围内运行。这意味着它在页面加载时运行，但不会在后续页面加载时运行，因为jQuery Mobile通过AJAX将外部页面拖入相同的DOM。因此，要运行每个虚拟页的AJAX请求我会绑定到pageinit事件：

$(document).delegate('[data-role="page"]', 'pageinit', function() { 
    //run AJAX request 
});

此外，如果你有以下ID每个页面上的元素，#sun/#mon /等。那么您应该将它们更改为类或以某种方式使它们具有唯一性，这样您就不会在DOM中同时拥有多个具有相同ID的元素。您可以轻松地通过使用$.mobile.activePage参考选择当前页面上的元素：

$.mobile.activePage.find('.sun')...

来源

2012-03-21 20:50:19 Jasper

这工作我已经得到了上面的代码，但我希望的是，回答我的问题会在我的其他网页工作。但是，当我点击一个链接并转到第二页时，这不起作用 - 第二页上的动态内容不会加载。此外，我只在这个页面上有这些ID的元素。我的应用程序中的每个页面都不同，并且它们都在单独的HTML文件中。我已经将第二页的代码添加到我的问题中，以便您可以看到那里发生了什么（以原始格式，在我尝试document.delegate之前） – 2012-03-21 21:08:14

动态内容不加载与jquery移动

回答

相关问题