jQuery Mobile在点击锚标记后不会移动到下一个页面

问题描述:

我正在使用jQuery移动框架来实现移动网站。但是,当我点击一个锚标记时,页面将不会正确加载,并会显示一个空白页面,如截图所示。jQuery Mobile在点击锚标记后不会移动到下一个页面

jQuery和jQuery Mobile的脚本标签:

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" /> 
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> 

Screenshot

我的JSP页面:

<a href="<c:url value="/${cityName}/cakes/c/4"/>"> 
    <img class="img-responsive center-block" src="/sf/assets/img/app/city-home/cake.jpg" alt="cakes" > 
</a> 

点击锚标记之后,控制进入控制器(JAVA)和那么控制器将返回一个JSP页面;但是,显示一个空白页面。如果我重新加载页面,则数据显示正确。

下面的行导致控制去m-category-page

返回“/目录/米类产品”;

但是,这个页面第一次没有任何内容,但是在重新加载页面之后,内容被加载了。点击锚标签后,下一页应显示所有数据。

+1

尝试(”数据阿贾克斯=“false”>) - http://demos.jquerymobile.com/1.2.1/docs/pages/page-links.html – Tasos

默认情况下,jQuery Mobile增强了所有链接标记,使它们通过ajax加载页面;因此,减少了页面加载时间和“提高性能”。见This

ajaxEnabled布尔值,默认值:true
如果可能,jQuery Mobile将自动处理链接点击和通过Ajax表单提交。如果为false,URL哈希监听也将被禁用,并且URL将作为普通的HTTP请求加载。

您可以通过添加data-ajax="false"属性您的链接禁用单个标签这个AJAX增强。您也可以完全全局禁止它这样的:

$(document).on("mobileinit", function() { 
    $.mobile.ajaxEnabled = false; 
}); 
+0

感谢您的回答。如果你喜欢我的问题,那么请投票支持他人。 –