JQuery Mobile入门——设置后退按钮文字(转)

时间:2022-09-23 19:01:09

http://www.tuicool.com/articles/AZnYVz

JQuery Mobile入门——设置后退按钮文字

1、给page容器头部添加后退按钮,只需在page容器中添加data-add-back-btn属性,并将属性值设置为true。显示默认为back,可修改data-back-btn-text属性值来设置后退按钮中显示的文字。

2、示例代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML> 
 <HEAD> 
  <TITLE> New Document </TITLE> 
  <meta name="viewport" content="width=device-width,initial-scale=1"/> 
  <link href="Css/jquery.mobile-1.2.0.min.css" rel="Stylesheet" type="text/css"/> 
  <script src="Js/jquery-1.8.3.min.js" type"text/javascript"></script> 
  <script src="Js/jquery.mobile-1.2.0.min.js" type="text/javascript"></script> 
  <script type="text/javascript"> 
    $(function(){ 
  $.mobile.page.prototype.options.backBtnText="后退"; 

  </script> 
 </HEAD> 
 <BODY> 
   <div data-role="page" id="e1" data-add-back-btn="true"> 
     <div data-role="header"><h1>后退按钮文字</h1></div> 
<div data-role="content"><a href="#e2">下一页</a></div> 
<div data-role="footer"><h4>@2013 3I Studio</h4></div> 
   </div> 
    <div data-role="page" id="e2" data-add-back-btn="true"> 
     <div data-role="header"><h1>后退按钮文字</h1></div> 
<div data-role="content"><a href="#e3">尾页</a></div> 
<div data-role="footer"><h4>@2013 3I Studio</h4></div> 
   </div> 
    <div data-role="page" id="e3" data-add-back-btn="true" data-back-btn-text="首页"> 
     <div data-role="header"><h1>后退按钮文字</h1></div> 
<div data-role="content"><a href="#e1">首页</a></div> 
<div data-role="footer"><h4>@2013 3I Studio</h4></div> 
   </div> 
 </BODY>

</HTML>

3、效果图预览:

JQuery Mobile入门——设置后退按钮文字(转) 点击下一页 JQuery Mobile入门——设置后退按钮文字(转) 点击尾页 JQuery Mobile入门——设置后退按钮文字(转)

JQuery Mobile入门——设置后退按钮文字(转)的更多相关文章

  1. jQuery Mobile 入门基础教程

    jQuery Mobile是jQuery在手机上和平板设备上的版本.jQuery Mobile 不仅会给主流移动平台带来jQuery核心库,而且会发布一个完整统一的jQuery移动UI框架. jQue ...

  2. jQuery Mobile入门

    转:http://www.cnblogs.com/linjiqin/archive/2011/07/17/2108896.html 简介:jQuery Mobile框架可以轻松的帮助我们实现非常好看的 ...

  3. jQuery Mobile入门教程

    简介:jQuery Mobile框架可以轻松的帮助我们实现非常好看的.可跨设备的Web应用程序.我们将后续的介绍中向大家介绍大量的代码及实例. jQuery一直以来都是非常流行的富客户端及Web应用程 ...

  4. jquery mobile 入门

    简介:jQuery Mobile框架可以轻松的帮助我们实现非常好看的.可跨设备的Web应用程序.我们将后续的介绍中向大家介绍大量的代码及实例. jQuery一直以来都是非常流行的富客户端及Web应用程 ...

  5. jquery Mobile入门—多页面切换示例学习

    1.在JQuery Mobile中,多个页面的切换是通过<a>元素.并将<href>属性设置为#+对应的id号的方式进行的. 2.多页面切换示例代码: 复制代码代码如下: &l ...

  6. 【学习】一本案例驱动的jQuery Mobile入门书

    清华大学出版社推出的<构建跨平台APP:jQuery Mobile移动应用实战> 提供的全是jQuery Mobile的案例: 手机入侵 题库应用 音乐专辑 通讯录 新闻列表 销售排名 九 ...

  7. Jquery Mobile下设置radio控件选中

    问题: .html文件头部引入了: <script src="js/jquery.js"></script> <script src="js ...

  8. 小强的HTML5移动开发之路(23)—— jQuery Mobile入门

    一.下载jQuery Mobile 下载地址:http://jquerymobile.com/ 点击Download 下载如下zip包 下载成功后如下图 解压目录如图: 点击index.html进入d ...

  9. 开发者必读jQuery Mobile入门教程

    你每天都会对着它讲话,和它玩游戏,用它看新闻——没错,它就是你裤兜里的智能手机.android,黑莓还是iphone?为了让你清楚意识到究竟哪些才算是智能手机,我在下面总结了一个智能手机系统/设备的列 ...

随机推荐

  1. web页面放到手机页面,缩放问题

    有时候写页面样式不规范,很多页面元素写死尺寸时,web页面尺寸比较大放到移动端访问时,就背缩放了,div或者按钮变得好小 可以加段js,效果会好点 <script> ! function( ...

  2. 转一篇老外写的博文:Android automated testing &lpar;Robotium&rpar;

    Robotium的中文资料甚少,只得求助于老外,发现了一篇不错的文章:https://blog.codecentric.de/en/2011/03/android-automated-testing- ...

  3. 算法Sedgewick第四版-第1章基础-001递归

    一. 方法可以调用自己(如果你对递归概念感到奇怪,请完成练习 1.1.16 到练习 1.1.22).例如,下面给出了 BinarySearch 的 rank() 方法的另一种实现.我们会经常使用递归, ...

  4. HDOJ --- 1159 Common Subsequence

    Common Subsequence Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Other ...

  5. Studious Student Problem Analysis

    (http://leetcode.com/2011/01/studious-student-problem-analysis.html) You've been given a list of wor ...

  6. js解决苹果移动端300ms延迟的问题

    做移动端页面开发的可能会了解到,ios系统click事件会有卡顿的现象,这个问题的根源是苹果本身自带的safari有双击放大页面的功能,再次双击会返回到原始尺寸,所以在第一次点击的系统会延迟300ms ...

  7. linux相关概念

    最近这段时间玩Linux比较多,前面我也转载了好多的相关的Linux指令.这里自己关于Linux概念来自己整理一下. 首先我们应该知道Linux到底是什么? 我们知道Linux这玩意儿是在计算机上面运 ...

  8. AjaxHandler

    概要 AjaxHandler组件是在ASP.NET MVC Web应用程序中实现ajax功能的一系列扩展方法,该组件的最初的实现方法借鉴了网上流行的部分源代码, ,经过博主不断完善和改进后推出的比较成 ...

  9. rocketmq在linux上安装

    1.下载bin压缩包,然后解压 官网下载地址:https://www.apache.org/dyn/closer.cgi?path=rocketmq/4.3.2/rocketmq-all-4.3.2- ...

  10. oracle修改用户密码过期时间

    Oracle默认在default概要文件中设置了“PASSWORD_LIFE_TIME=180天”,导致密码过期,程序无法使用,业务进程会提示无法连接数据库等字样. --查询默认密码过期时间 SELE ...