2

我有一个 MVC Web 应用程序，它使用 PHP 检查查询字符串中的内容，并通过呈现页眉、内容和页脚来加载适当的页面（例如 ?category=1 加载呈现类别视图的 CategoryController）。

我还有一个 custom.js，它将 jQuery 功能添加到 DOM 中的元素。由于动态内容由 PHP 控制，因此 jQuery 功能仅在页面首先加载时才起作用。遍历应用程序不会刷新页面，因此新包含的元素不会添加到 jQuery 对象中。

关于如何解决这个问题的任何想法？

4

1 回答 1

1

首先不要将$(function()或$(document).ready()与 jQuery Mobile 一起使用，因为 jQM 不是为那样工作而构建的。相反，您应该使用此处提到的页面事件：https ://stackoverflow.com/ a/14010308/1848600或 mobileinit 事件如下：

$(document).on("pageinit", function () {

});

或 mobileinit 如果您希望它在应用程序执行时只执行一次：

$(document).on("mobileinit", function () {

});

原因在顶部链接中描述。您还可以在 jQM 官方文档中找到更多相关信息：http: //jquerymobile.com/test/docs/api/events.html

现在，如果您希望 jQM 重新设置页面样式，您应该使用.trigger('pagecreate')函数。

假设，例如，您有一个带有 id索引的 jQM 页面，这是您生成的布局。

<div data-role="page" id="index">
    <div data-theme="a" data-role="header">
        <h3>
            First Page
        </h3>
        <a href="#second" class="ui-btn-right">Next</a>
    </div>

    <div data-role="content">
        <a href="#" data-role="button" id="test-button">Test button</a>
    </div>

    <div data-theme="a" data-role="footer" data-position="fixed">

    </div>
</div>

要强制 jQM 对其进行样式设置，您应该使用以下内容：

$('#index').live('pagebeforeshow',function(e,data){    
    $('#index').trigger('pagecreate');
});

或者如果你想将它应用到每个 jQM 页面，像这样使用它：

$('[data-role="page"]').live('pagebeforeshow',function(e,data){    
    $(this).trigger('pagecreate');
});
于 2013-01-21T15:44:04.697 回答