Question

使用jQuery Mobile时我遇到了这个问题。当我登陆主页时，所有的CSS和JavaScript工作正常。单击链接或按钮时，事件按预期工作。

但是在进入任何页面后说“关于我们”然后刷新该特定页面，如果我们回到主页，一些CSS丢失了，而且javascript也不再起作用，虽然链接工作正常。

返回主页后，简单警报也无法正常工作。任何帮助表示赞赏。感谢

Answer 1

jQuery Mobile中的标准Ajax导航只会检索您要导航到的页面的<body>。这意味着将忽略链接到/后续页面标题中定义的任何CSS或脚本。这意味着用户加载的第一页的标题必须包含所有后续页面上所需的所有样式/脚本。如果您刷新“约”，这将成为您的初始页面，显然此页面的标题不包含与您的主页相同的内容。您可以更新标题或使用链接中的rel="external"或data-ajax="false"属性来禁用JQM ajax导航，并以更常规的方式导航到“about”页面/从“about”页面导航，整个页面将是加载。您可以查看this page了解详情。

Answer 2

转到其他页面并刷新即可删除<body>中的所有内联样式。

尝试使用外部样式表以确保样式保存。

刷新前的<body>：

<body style="background: -moz-linear-gradient(top, #E7E7E7, #121212); background: -webkit-gradient(linear, center top, center bottom, from(#E7E7E7), to(#121212));" class="ui-mobile-viewport ui-overlay-d">

刷新后的<body>：

<body class="ui-mobile-viewport ui-overlay-c">

这个页内脚本也在消失，尝试将其移动到外部脚本：

<script type="text/javascript">
            $(document).ready(function(){
                $(".second-tech").hide();
                $(".third-tech").hide();

                $("#mobileicon").click(function(){
                    if ($(".second-tech").is(':visible')) {

                       //... Lots more code...

                });
            });
        </script>

刷新jquery mobile后样式和javascript无法正常工作

2 个答案: