`

JqueryMobile 如何禁掉ajax跳转?

 
阅读更多
问题描述:
尽管ajax跳转有很炫的转屏动画,但是在某些时候为了性能或者为了业务需求还是需要禁掉ajax跳转的。
解决办法:
禁止ajxa跳转有两种情况:
1、禁止局部ajax跳转
2、禁止全局ajax跳转 
 
对于#1只需要在a标签中添加下面的属性:
data-ajax=“false”
有时我们要用正常的http请求而不用Ajax请求,比如链接到别的网站等情况。通过给a标签加下面的属性,可以将链接指定为正常的http请求:
rel=external
对于#2我们需要设置一个全局的禁止ajax跳转的方式,js代码如下:
$(document).bind("mobileinit", function() {
                       //disable ajax nav
                       $.mobile.ajaxEnabled=false
               });
注意:上面的代码片段需要放在jquery.mobile-xxx.min.js引入之前。
顺便说一句,初始化的设置都需要放在此处,例如加载错误信息的设置:
$.mobile.pageLoadErrorMessage = 'Sorry, something wentwrong. Please try again.';
分享到:
评论

相关推荐

    JqueryMobile页面间跳转时的参数传递

    ### JqueryMobile页面间跳转时的参数传递 在使用jQuery Mobile进行移动Web应用开发时,经常需要在不同页面之间传递参数。这种功能对于实现页面之间的数据交互至关重要。本文档将通过一个具体的代码示例来详细说明...

    jquerymobile设计完整例子

    jQuery Mobile 使用无刷新技术(AJAX)来实现页面间的平滑切换。通过设置`data-rel="next"`或`data-rel="back"`,可以实现向后或向前的页面跳转。同时,`data-transition`属性可以指定过渡动画,如滑动、淡入淡出等...

    JQueryMobile与后台通信

    1. **默认行为**:在jQuery Mobile中,表单提交会触发页面跳转,但可以通过设置`data-ajax="true"`使表单提交变为AJAX请求。 2. **阻止默认行为**:如果需要自定义AJAX提交,可以使用`event.preventDefault()`阻止...

    JqueryMobile常见问题整理

    在 jQuery Mobile 中,页面间跳转可能导致样式丢失或 JavaScript 失效,这是因为 AJAX 导航可能无法正确地重新应用样式和重新执行脚本。 **问题分析:** 这可能是由于 jQuery Mobile 的页面结构导致的,它通常将多...

    jQuery Mobile快速入门源代码

    3. **增强型链接 (Enhanced Links)**:jQuery Mobile 自动处理链接,使页面在同域内通过 AJAX 进行无刷新跳转,提供更好的用户体验。通过添加 `data-rel="back"` 属性,可以模拟浏览器的后退功能。 4. **触控事件**...

    jQuery Mobile 1.1.1最新版

    9. **数据绑定和AJAX导航**:jQuery Mobile 使用AJAX技术实现无刷新页面切换,提供了更好的导航体验。同时,框架支持数据绑定,可以动态更新页面内容,增强了交互性。 10. **兼容性**:jQuery Mobile 1.1.1 支持...

    JQuery Mobile需要的包

    **jQuery Mobile 知识点详解** jQuery Mobile 是一个流行的前端框架,专为移动设备设计,用于构建响应式、触控友好的网页应用。这个框架基于 jQuery 库,提供了丰富的组件和交互效果,使得开发者能够快速地创建功能...

    jQueryMobile Ajax开发

    ### jQueryMobile Ajax开发知识点概述 #### 一、版本特性 1. **Push State 支持**:jQuery Mobile (JQM) 在此版本中加入了对 `history.pushState` 的支持,这是一个 HTML5 API,允许开发者在不刷新页面的情况下...

    jquery mobile 餐厅实例

    3. **增强型链接:** 通过设置`data-ajax="true"`,jQuery Mobile 可以实现页面无刷新跳转,提供更流畅的用户体验。 4. **触控事件:** 支持触摸事件,如`tap`、`swipe`等,使得在移动设备上的交互更为自然。 **二...

    Jquery mobile 中文开发文档

    - **页面链接(Page Links)**:使用 `rel="external"` 或 `data-ajax="false"` 可以禁用 AJAX 导航,以跳转到外部页面或执行非 AJAX 请求。 - **导航历史(Navigation History)**:jQuery Mobile 会跟踪页面访问...

    jquery mobile注册登录例子

    jQuery Mobile 的一大特点就是使用AJAX技术进行页面间的平滑过渡,通过`data-ajax="false"`禁止AJAX加载,对于需要重新加载整个页面的情况,如登录成功跳转到主页面。 五、注册与登录逻辑 1. 后端接口:后端需提供...

    JqueryMobile基础,初学者

    当页面加载或通过 AJAX 加载时,jQuery Mobile 会自动对页面进行“增强”,将普通的 HTML 转换成具有触控效果的组件。你也可以手动触发这个过程: ```javascript $(document).on("pagecreate", "#myPage", function...

    jquery mobile

    默认情况下,jQuery Mobile 在 AJAX 跳转后会清除当前页面的 DOM 结构,从而导致 `pageinit` 事件每次跳转时都会重新触发。设置 `data-dom-cache="true"` 可以保留 DOM,避免重复触发 `pageinit` 事件。 ### 动态...

    Jquery Mobile 类库

    **jQuery Mobile 库详解** jQuery Mobile 是一个专为触摸设备设计的前端框架,它基于 jQuery,主要用于构建响应式和移动优化的网页应用。这个库旨在提供一套完整的组件和交互模式,使得开发者能够轻松创建功能丰富...

    jQuery Mobile权威指南源码

    jQuery Mobile 默认使用Ajax技术来实现页面间的导航,以提供无缝的浏览体验。然而,这可能会对SEO和书签功能造成影响。因此,在某些场景下,可以禁用Ajax导航或使用 `data-ajax="false"` 属性来恢复传统的HTTP跳转。...

    Jquery Mobile a4 中文手册

    页面之间的跳转可以通过AJAX实现,提供类似原生应用的体验。 五、表单和输入元素 jQuery Mobile对HTML5表单进行了增强,包括自定义样式、增强的验证提示和输入类型的自动适配。例如,`<input type="date">`会被自动...

    jquery mobile快速入门 例子

    jQuery Mobile 改写了标准的HTML链接行为,使页面间跳转更加平滑。使用`<a>`标签,配合`href`属性指向目标页面,jQuery Mobile会自动处理页面过渡效果。若想阻止默认的页面加载,可以添加`data-ajax="false"`。 四...

    jquery mobile快速入门

    - **插件扩展**:jQuery Mobile 提供了一系列插件来增强功能,如 Ajax 导航、表单验证等。 #### 六、实战案例分析 - **示例一:简单的页面切换** - 创建两个页面,每个页面包含一个按钮,点击按钮跳转到另一个...

    基于Jquery Mobile的用户登录 注冊的 Demo

    Jquery Mobile是一款强大的前端开发框架,专为移动设备优化,它简化了移动Web应用的开发,并提供了丰富的交互元素和触摸友好的界面设计。在这个“基于Jquery Mobile的用户登录注册Demo”中,我们将深入探讨如何利用...

Global site tag (gtag.js) - Google Analytics