码迷,mamicode.com
首页 > Web开发 > 详细

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

时间:2015-04-20 18:21:40      阅读:127      评论:0      收藏:0      [点我收藏+]

标签:

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入门——设置后退按钮文字(转)

标签:

原文地址:http://www.cnblogs.com/dlbird/p/4442181.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!