<!doctype html>

<html lang="en">

<head>

  <meta charset="utf-8">

  <meta name="viewport" content="width=device-width, initial-scale=1">

  <title>jQuery.mobile.activePage demo</title>

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

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

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

  <style>

  #myResult {

    border: 1px solid;

    border-color: #108040;

    padding: 10px;

  }

  </style>

</head>

<body>

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

  <div data-role="header">

    <h1>Page 1</h1>

  </div>

  <div data-role="content">

    <a href="#page2" data-role="button" data-inline="true">Go to Page 2</a>

    <input type="button" value="Which Page is this?" class="myButton" data-inline="true"/> <br>

    <div class="myResult">The result will be displayed here</div>

  </div>

</div>

<div data-role="page" id="page2">

  <div data-role="header">

    <h1>Page 2</h1>

  </div>

  <div data-role="content">

    <a href="#page1" data-role="button" data-inline="true">Go to Page 1</a>

    <input type="button" value="Which Page is this?" class="myButton" data-inline="true"/> <br>

    <div class="myResult">The result will be displayed here</div>

  </div>

</div>

<script>

$(function() {

  $( ".myButton" ).on( "click", function() {

    var whichPageId = $.mobile.activePage.attr( "id" );

    $( ".myResult" ).html( "This is " + whichPageId );

  });

});

</script>

</body>

</html>

jQuery.mobile.activePage获取当点活动的page的更多相关文章

  1. jQuery Mobile + HTML5 获取地理位置信息

      这个代码也非常简单,核心是HTML5中GeoLocation API,函数原型定义如下: void getCurrentPosition(in PositionCallback successCa ...

  2. jQuery Mobile Api

        jQuery Mobile提供了使用Javascript与框架(html5)通信以及进行内容管理的API.下面介绍具体事件. 文档事件     mobileinit事件会在jQuery Mob ...

  3. jQuery Mobile学习日记（二）

    首先依HTML5方式加载,DOCTYPE表示格式为HTML5:主要适用于iPhone.Android等,viewport表示适用于移动终端的适中显示,initial-scale缩放比例在1.0~1.3 ...

  4. 学习jquery mobile

    学习jquery mobile的时间不是很长,在学习的过程当中也遇到了很多令人抓狂的问题,在网上搜索问题答案的时候发现,现在关于jquery mobile的文章还不是很多,所以,我也是一边学习,一边摸 ...

  5. [转]Passing data between pages in JQuery Mobile mobile.changePage

    本文转自:http://ramkulkarni.com/blog/passing-data-between-pages-in-jquery-mobile/ I am working on a JQue ...

  6. JQuery Mobile的页面

    1.JQuery Mobile的页面结构如下图: page:是在浏览器中显示的页面 header:创建页面上方的工具栏(常用于标题和搜索按钮) content:定义了页面的内容,比如文本, 图片,表单 ...

  7. 如何修改Jquery Mobile 设置默认选项

    以下的默认配置可以通过$.mobile对象重新配置自定义命名空间s (字符, 默认: ""): 在jQuery Mobile中,甚至可以自定义象HTML5中的data-attrib ...

  8. jQuery.mobile.changePage的参数

    选项 类型:对象 属性: allowSamePageTransition(默认值:假的) 类型:布尔 默认情况下,changePage()忽略请求更改为当前活动页面.将此选项设置为true,则允许该请 ...

  9. jQuery Mobile中jQuery.mobile.changePage方法使用详解

    jQuery.mobile.changePage方法用的还是很多的.作为一个老手,有必要对jQuery mobile中实用方法做一些总结.系列文章请看jQuery Mobile专栏.jquery.mo ...

随机推荐

  1. ZOJ3795 Grouping（强连通分量+缩点+记忆化搜索）

    题目给一张有向图,要把点分组,问最少要几个组使得同组内的任意两点不连通. 首先考虑找出强连通分量缩点后形成DAG,强连通分量内的点肯定各自一组,两个强连通分量的拓扑序能确定的也得各自一组. 能在同一组 ...

  2. FZU2215 Simple Polynomial Problem（中缀表达求值）

    比赛时没做出这题太可惜了. 赛后才反应过来这就是个中缀表达式求值,数字栈存的不是数字而是多项式. 而且,中缀表达式求值很水的,几行就可以搞定. #include<cstdio> #incl ...

  3. Unity3d中SendMessage 用法简单笔记

    Message相关有3条指令:SendMessage ("函数名",参数,SendMessageOptions) //GameObject自身的ScriptBroadcastMes ...

  4. Photoshop: 机关单位公章

    机关单位公章的大小与机构的级别有关,级别越高的公章越大,一般直径在3.8-4.2cm,很少有用4.5cm或3.4cm的.但企业的公章一般都很大. 首先点击文件新建,新建一个500×500像素(像素大小 ...

  5. 自己的一份Spring的xml配置文件

    <?xml version="1.0" encoding="UTF-8"?><beans xmlns="http://www.spr ...

  6. SqlServer主键外键添加及判断表是否存在

    GO --判断表是否存在方式1 if object_id(N'EF_User',N'U') is null --判断表是否存在方式2 --if not exists (select * from db ...

  7. Cobar_基于MySQL的分布式数据库服务中间件

    Cobar是阿里巴巴研发的关系型数据的分布式处理系统,是提供关系型数据库(MySQL)分布式服务的中间件,该产品成功替代了原先基于Oracle的数据存储方案,它可以让传统的数据库得到良好的线性扩展,并 ...

  8. Spring_讲解

    http://s,i,s,h,u,o,k.com/forum/blogPost/list/6174.html

  9. for循环下九九乘法表

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  10. Html - 404页面

    <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...