1 <!doctype html>

 2 <html>

 3 <head>

 4 <meta charset="utf-8">

 5 <title>无标题文档</title>

 6 <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css">

 7 <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>

 8 <script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>

 9 <script>

10 $(document).on("pagebeforecreate","#home",function(){

11     alert("pagebeforecreate");

12 });

13 $(document).on("pagecreate","#home",function(){

14     alert("pagecreate");

15 });

16 $(document).on("pageinit","#home",function(){

17     alert("pageinit");

18 });

19 $(document).on("pageload",function(event,data){

20     alert("触发pageload事件\nURL:"+data.url);

21 });

22 $(document).on("pageloadfailed",function(event,data){

23     alert("触发pageloadfailed事件,页面不存在");

24 });

25 $(document).on("pagebeforeshow","#page1",function(){

26     alert("触发pagebeforeshow事件,page1页面即将显示。\n事件是针对page1页面的事件");

27 });

28 $(document).on("pageshow","#page1",function(){

29     alert("触发pageshow事件，现在显示page1页面。\n事件是针对page1页面的事件");

30 });

31 $(document).on("pagebeforehide","#page1",function(){

32     alert("触发pagebeforehide事件，page1页面即将隐藏。\n事件是针对page1页面的事件");

33 });

34 $(document).on("pagehide","#page1",function(){

35     alert("触发pagehide事件，page1隐藏。\n事件是针对page1页面的事件");

36 });

37 </script>

38 </head>

39

40 <body>

41 <div data-role="page" id="home">

42     <div data-role="header">header</div>

43     <div data-role="content">

44         <a href="data-icon.html">存在data-icon.html</a>

45         <a href="data-icon2.html">不存在data-icon2.html</a><br/>

46         <p >页面home</p>

47         <a href="#page1" >跳到page1</a>

48     </div>

49     <div data-role="footer" data-theme="d">footer</div>

50 </div>

51 <div data-role="page" id="page1">

52     <div data-role="header" >page1</div>

53     <div data-role="content">

54         <p>page1</p><br>

55         <a href="#home">跳到home</a>

56     </div>

57     <div data-role="footer" >footer</div>

58 </div>

59 </body>

60 </html>

jquery_mobile事件的更多相关文章

  1. JNI详解---从不懂到理解

    转载:https://blog.csdn.net/hui12581/article/details/44832651 Chap1:JNI完全手册... 3 Chap2:JNI-百度百科... 11 C ...

  2. jQuery_mobile页面跳转事件学习

      <html>     <head>         <meta http-equiv="Content-Type" content="t ...

  3. Jquery的点击事件，三句代码完成全选事件

    先来看一下Js和Jquery的点击事件 举两个简单的例子 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&q ...

  4. 关于 Chrome 浏览器中 onresize 事件的 Bug

    我在写插件时用到了 onresize 事件,在反复地测试后发现该事件在 Chrome 及 Opera(内核基本与 Chrome 相同,以下统称 Chrome)浏览器打开时就会执行,这种情况也许不能算作 ...

  5. MVVM设计模式和WPF中的实现（四）事件绑定

    MVVM设计模式和在WPF中的实现(四) 事件绑定 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在WPF中 ...

  6. C++中的事件分发

    本文意在展现一个C++实现的通用事件分发系统,能够灵活的处理各种事件.对于事件处理函数的注册,希望既能注册到普通函数,注册到事件处理类,也能注册到任意类的成员函数.这样在游戏客户端的逻辑处理中,可以非 ...

  7. 移动端IOS点击事件失效解决方案

    解决方案 解决办法有 4 种可供选择: 1 将 click 事件直接绑定到目标元素(即 .target)上 2 将目标元素换成 <a> 或者 button 等可点击的元素 3 将 clic ...

  8. Android笔记——Button点击事件几种写法

    Button点击事件:大概可以分为以下几种: 匿名内部类 定义内部类,实现OnClickListener接口 定义的构造方法 用Activity实现OnClickListener接口 指定Button ...

  9. HTML 事件(一) 事件的介绍

    本篇主要介绍HTML中的事件知识:事件相关术语.DOM事件规范.事件对象. 其他事件文章 1. HTML 事件(一) 事件的介绍 2. HTML 事件(二) 事件的注册与注销 3. HTML 事件(三 ...

随机推荐

  1. 暑假学习计划：Day_1.JSP&Servlet&Tocat 环境搭建到基础的认识。

    1.了解JSP和Servlet(百度了解即可). 2.了解B/S和C/S.分别是  浏览器/服务器  和  客户端/服务器. 其中 B/S 被称为瘦模式(主流模式). 3.了解并下载Tomcat服务器 ...

  2. Fiddler基础使用二之捕获手机应用https请求

    Fiddler是一款非常流行并且实用的http抓包工具,它的原理是在本机开启了一个http的代理服务器,然后它会转发所有的http请求和响应, 因此,它比一般的firebug或者是chrome自带的抓 ...

  3. Java 加载、链接、初始化

    JVM 动态地加载.连接.初始化类或接口(在本文之后的篇幅中,我将使用"类"来表示"类和接口").这里我先贴上 Java 虚拟机规范的原文: Loading i ...

  4. Android -- 从源码的角度一步步打造自己的TextView

    1,自定义控件一直是我们的痛点,今天就和大家一点点去了解了解,首先一般的自定义控件都是继承于View类,所以我们先来看看view的一些重要的方法,这是官方文档,大家想了解更多也可以去看看,这里我展示对 ...

  5. table之thead兼容

    今天遇到一个小bug,是关于table中thead,tbody,tfoot的兼容问题: 在开发的时候为了方便写样式,我就把表格的标题部分关于th的内容放在了thead中,当然了,我也没有写tbody和 ...

  6. AIX smit下创建逻辑卷、添加文件系统并挂载

    --AIX smit下创建逻辑卷,添加文件系统并挂载------------------------------------------2013/10/15 首先创建逻辑卷smit lv ,这里没多大 ...

  7. MATLAB垂直搜索图片中的白段

    function [ top, bottom, middle, len ] = classify_by_vertical_white_belt( img ) % 垂直搜索图片中的白段, 记录具体信息. ...

  8. butterknife的8.5.1版本问题

    使用7.0.1版本没有问题compile 'com.jakewharton:butterknife:7.0.1'使用8.5.0版本时候,必须配合下面的compiler插件一起使用,否则会出现点击事件不 ...

  9. WTL--SDI框架分析

    创建SDI产生的基本类:CMainFrame,CAboutDlg和CWTLView(WTL为项目名). 由此可见,不同于MFC,WTL少了文档类,它的结构就只有简单的窗口类和视图类,而至于串行化(MF ...

  10. 一个基于ES6+webpack的vue小demo

    上一篇文章<一个基于ES5的vue小demo>我们讲了如何用ES5,vue-router做一个小demo,接下来我们来把它变成基于ES6+webpack的demo. 一.环境搭建及代码转换 ...