zoukankan      html  css  js  c++  java
  • 【新手向】jQuery mobile 跳转机制问题及其解决方法

    第一次做用jQuery Mobile做东西,发现一些跟平时的思维习惯不太一样的。其中这个框架的页面加载机制便是其中一个。如果不明白其中的奥秘,往往会出现一些让人摸不着头 脑的怪现象,比如页面进入后点击按钮后Javascript就是不执行,而用F5刷新页面后又可以正常执行等。

    即使我们明白了HTML文件与jQuery Mobile中page概念的区别,也还是不能解决上述问题。当然,了解这个是一个大前提。原来,jQuery Mobile是用Ajax的方式加载所有HTML中的标记data-role="page"的DIV元素中,第一个HTML页面一般都是完全加载,包括 HEAD BODY 都会被加载到DOM中,完成后便是链接到的其他页面内容的加载。 第二个HTML页面只有 BODY 中的内容会被以Ajax的方式加载到头一个HTML的 DOM中。 并且第二HTML页面的 BODY 中的内容也并非全部加载,而仅仅是其中的第一个带data-role="page"属性的DIV会被加载进去,其余的东西则无缘进入页面渲染。

    可以用以下方法来解决
    一是在index页面中,注册所有需要使用到的外部JS文件,或者使用母版页面来统一;
    二是将页面内部JS写在data-role="page"标签下,这样无论页面怎样跳转,均可以运行。
    三是用jqm页面事件pageshow():#pagetwo是有返回去的那个页面的id。

    $(document).on("pageshow","#pagetwo",function(){
      alert("写上你要调用的js代码在这里");
    });

    资料来源:http://stackoverflow.com/questions/17403825/link-fails-to-work-unless-refreshing/17403907#17403907

  • 相关阅读:
    demo_38 关注页导航栏实现
    demo_37 评论列表实现_02 封装popup 及 格式化时间
    demo_37 评论列表实现_01
    SaaS
    rsyncd脚本
    rsyncd
    MySQL高可用--MHA安装
    正向代理
    zabbix 一键部署
    kvm安装
  • 原文地址:https://www.cnblogs.com/babysay123/p/4494507.html
Copyright © 2011-2022 走看看