单击锚标记后,jQuery Mobile不会移动到下一页

时间:2016-02-13 12:55:15

标签: javascript java jquery jsp jquery-mobile

我正在使用jQuery移动框架来实现移动网站。但是当我点击锚标签时,页面将无法正确加载,并会出现一个空白页面,如屏幕截图所示。

jQuery和jQuery Mobile Script标签:

<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

  

返回“/ catalog / m-category-products”;

但是这个页面第一次没有任何内容,但是,重新加载页面后,内容已加载。单击锚标记后,下一页应显示所有数据。

1 个答案:

答案 0 :(得分:1)

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

  

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

您可以通过向链接添加data-ajax="false"属性来为单个标记禁用此ajax增强功能。您也可以像这样完全禁用全球

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