Jquery mobile 自定义返回按钮 data-rel="back"

最新推荐文章于 2022-12-12 14:07:28 发布

转载最新推荐文章于 2022-12-12 14:07:28 发布 · 334 阅读

文章标签：

#javascript #ViewUI

本文介绍了一个简单的HTML页面跳转示例，包括主页面和详情页面的结构及使用JavaScript进行页面跳转的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

data-rel="back"

第一个页面主页面 studentmaster.html 通过下面js脚本跳转到详情页面

window.location.href="studentdetail.html";

[html] view plain copy

<body>
<div data-role="page" id="page">
<div data-role="header">
<h1>学员风采</h1>
</div>
<ul data-role="listview" data-inset="true" data-mini="true">
</ul>
<div data-role="footer" data-position="fixed" id="footer">
</div>
</div>
</body>

第二个页面详细页面studentdetail.html

[html] view plain copy

<body>
<div data-role="page" id="page">
<div data-role="header">
<a href="studentmaster.html" data-icon="back" data-ajax="false" data-rel="back">返回</a>
<h1></h1>
</div>
<div data-role="content">
</div>
</div>
</body>

关注博主即可阅读全文

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_34265814

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

Jquery mobile 自定义 返回按钮 data-rel="back"

bibi

12-02

6695

data-rel="back" 第一个页面主页面 studentmaster.html 通过下面js脚本跳转到详情页面 window.location.href="studentdetail.html"; 学员风采第二个页面详细页面studentdetail.html data-

jQuery-Mobile学习（弹窗）

WEB_HW

01-11

2438

很开心能学到这个地方。因为我一直觉得做一个很酷很炫的弹窗是一件很令人开心舒服的事情。从前面的几次学习可以了解，在JQuery-Mobile中data-rel通常用来表示某种调用关系,比如返回之前页面的按钮就是data-rel=“back”.a标签中的href属性值一般可以实现id值或者页面跳转。data-role则一般是定义某个部分的角色。我一般从单词理解。其次我们还学习了data-po

参与评论您还未登录，请先登录后发表或查看评论

Jquery mobile data-rel="back"模拟返回

qq_36087244的博客

09-21

356

记一次恶心的bug，手机端返回前面页面导致一直失败，跟踪js发现a标签的href已经进去了，但是还是返回错误的页面，搞得心态爆炸，最后找到这个 data-rel="back" back改为none，解决。。。。 Jquery mobile 的这个属性会模拟后退按钮，类似浏览器的后退按钮，并会忽略a标记本身的href。 ...

新版JQuery Mobile返回按钮

dangzhao2003的博客

05-07

672

$.mobile.toolbar.prototype.options.addBackBtn = true;

1.4.jquerymobile--页面转换效果

weixin_30657541的博客

03-16

108

<!DOCTYPE html> <html> <html lang="zh-CN"> <head> <title>1.4.jquerymobile--页面转换效果</title> <meta charset="utf-8"/> <meta name="viewport" conte...

jquery mobile 实现自定义confirm确认框效果的简单实例

11-24

jQuery Mobile 提供了一种更美观、可自定义的解决方案，通过其丰富的UI组件可以创建出更加精致的确认对话框。本实例将介绍如何使用jQuery Mobile实现一个自定义的确认框效果。首先，确保在项目中引入了以下文件： ...

JqueryMobile快速上手教程－实训任务书01-我的第一个JqueryMobile页面

03-25

3. **导航结构（Navigation Structure）**：使用 `data-rel` 属性创建链接间的导航关系，如 `data-rel="back"` 返回前一页，`data-rel="dialog"` 创建对话框样式页面。 4. **主题（Theming）**：jQuery Mobile 提供...

JqueryMobile快速上手教程－实训任务书04-外页设计-班级通知页.zip

03-25

<a href="#" data-rel="back" data-icon="back">返回 <div data-role="footer"> <h4>2022级计算机科学班 ``` ### 4. 内容区域（Content）内容区域通过`data-role="content"`定义，它是页面的主要部分，可以...

JqueryMobile快速上手教程－实训任务书03-多页设计-学生成绩查询页.zip

03-25

页面之间可以通过`data-rel="next"`或`data-rel="back"`进行切换。 3. **数据绑定**：在学生成绩查询页中，可能需要动态加载和更新数据。可以使用jQuery的`.load()`或`.ajax()`方法获取服务器上的成绩数据。 ### 二...

jQuery Mobile添加后退按钮

热门推荐

FFy's Blog

01-26

1万+

我们页面是jQuery Mobile的主要单位。一个典型的页面可以分为页头、内容、页脚。接下来我们就看看如何在jQuery Mobile页面中添加后退按钮在稍微早一些的版本中，我们在page中添加data-add-back-btn="true"即可添加后退按钮 header content footer 新手

jquerymobile-5 back button和footer

孟祥月的专栏

01-10

9296

使用jquerymobile的时候，我们新进入一个页面可能需要添加一个返回按钮，用户返回到上一个页面，我们可以使用上一篇文章中的方法，在Header中添加返回上一个页面的链接，但是这样有一点不好，如果这个页面有多个入口（即可以从多个页面跳入本页面），那么我们这个返回就得做判断了。在这种情况下我们可以使用jquerymobile的data-add-back-btn属性，并将其值设为true。这样jq

data-rel

piaofenglanyan的专栏

04-08

1771

data-rel规定有关链接如何行为的选项。

jquery mobile中为页面添加返回按钮的两种方式

u013905744的专栏

08-10

3160

jquery mobile中为页面添加返回按钮的两种方式 data-add-back-btn=”true” data-rel=”back”

js里设置<a>标签的data-rel属性实例

Agust1990的专栏

08-07

6986

js 中，用setAttributesmy_href.setAttribute("data-rel","popup");

jQuery Data 属性

Proction的博客

12-12

1222

JS中的data自定义属性

jQuery Mobile：打造移动应用的快速指南

页面间的导航可以通过链接（`<a>`标签）实现，使用`data-rel="next"`或`data-rel="back"`来前进或后退。 **数据增强（Data-Enhancement）**： jQuery Mobile会自动检测页面中的HTML元素，并根据数据属性对其进行...

Jquery mobile 自定义 返回按钮 data-rel="back"

Jquery mobile 自定义返回按钮 data-rel="back"