在点击图片/标题需要跳转到详情页面的使用场景中,首先定义图片元素的id为“tyzc”,是同一类下的第一个图片

<img src="img/img3.png" width="40" height="40" id="tyzc" pageTarget="index2">
//pageTarget是自定义的
<div class="mui-media-body">拟退役资产</div> 

1-

<script type="text/javascript">
mui("#tyzc")[0].addEventListener("tap",function(){//转化为DOM元素后,要绑定的图片id为tyzc的第一个元素
    alert(test);
    window.location.href="index.html";
})
</script> 

2-

<script type="text/javascript">
mui("img")[0].addEventListener("tap",function(){//转化为DOM元素后,限定为img类,然后绑定img的第一个元素
alert(test);window.location.href="index.html";
})
</script>

3-

<a href="#">//在每个要跳转的元素后添加<a>超链接标签,用自己要跳转的url地址代替#

4-  将九宫格中的图片批量绑定要跳转的页面  以上为单个图片的跳转,要实现批量操作多个图片的跳转时:

<script type="text/javascript">
mui('.mui-content').on('tap', 'img', function() { var pageName = this.getAttribute("pagetarget");
window.location.href = pageName+".html";
});
</script>

  

 

MUI+html5+script 不同页面间转跳(九宫格)的更多相关文章

  1. mui框架如何实现页面间传值

    mui框架如何实现页面间传值 我的传值 listDetail = '<li class="mui-table-view-cell mui-media>">< ...

  2. HTML5 Web存储 页面间进行传值

    在实际使用过程中,经常会遇到需要在页面间进行传值的情况,最初设想一定需要后端才能进行数据的存储和读取,或者在本地使用一个cookie进行保存,直到了解到HTML5 Web存储 使用HTML5的新特性可 ...

  3. Android实现不同Active页面间的跳转

    Intent intent = new Intent(); intent.setClass(ErrorPageActive.this, LoginActive.class); startActivit ...

  4. Html学习之一(锚点链接的使用,页面间的跳转)

    页面一: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <ti ...

  5. 【HarmonyOS】【DevEco Studio】NOTE04:How to Jump to a Page(页面间的跳转)

    页面创建与基本设置 创建页面 创建两个新页面,分别为AbilityPage1.AbilityPage2 设置页面基本内容 以AbilityPage1为例 导包 import com.example.m ...

  6. android开发 单击按钮 实现页面间的跳转

    我的MainActivity.java部分代码 public class MainActivity extends ActionBarActivity { //不要定义button类型,会出错 Vie ...

  7. MUI框架-02-注意事项-适用场景-实现页面间传值

    MUI框架-02-注意事项-适用场景-实现页面间传值 关于开发,我拷贝太多也没什么意义,就请查阅:官方文档:http://dev.dcloud.net.cn/mui/ui/ 快速入门 - 注意事项 有 ...

  8. Metro 页面间跳转报错、打包和安装一个本地的Metro类型应用

    1.模板页面间传值跳转报错误 参照:http://www.cnblogs.com/dagehaoshuang/archive/2012/08/31/2665166.html#2862480 强烈推荐, ...

  9. ionic页面间跳转的动画实现

    1. 在<ion-view>标签中加入: nav-direction="back"或nav-direction="forward" 2.用$stat ...

随机推荐

  1. java的原子类到底是啥?ABA,CAS又是些什么?

    1)解决并发不是用锁就能解决吗,那SDK干嘛还要搞个原子类出来? 锁虽然能解决,但是加锁解锁始终还是对性能是有影响的,并且使用不当可能会造成死锁之类的问题. 2)原子类是怎样使用的,比如说我要实现一个 ...

  2. 记一次曲折的CVE-2018-1270复现分析

    前言 前两天接到朋友对某个授权目标的漏扫结果,也算是初次接触到这个漏洞,就想着顺手分析一下复现一下,因为分析这个漏洞的文章也比较少,所以刚开始比较迷,进度也比较慢. 漏洞复现 使用vulhub搭建环境 ...

  3. js读取cookie 根据cookie名称获取值的方法

    //方法1 //存在问题:如果cookie中存在 aaaname=aa;name=bb 获取name的值就会出现错误function getCookie(c_name){ if (document.c ...

  4. MySQL外键约束On Delete和On Update的使用

    On Delete和On Update都有Restrict,No Action, Cascade,Set Null属性.现在分别对他们的属性含义做个解释. ON DELETE restrict(约束) ...

  5. EMS恢复禁用邮箱

    使用PowerShell命令恢复禁用邮箱 键入以下命令: [PS] C:\Windows\system32>Get-MailboxDatabase | Get-MailboxStatistics ...

  6. ABP源码分析 - 约定注册(2)

    比较随意,记录下过程,以便忘了以后重拾. 所谓约定注册是指不需要明确写代码注入,只需要按约定规则写服务类,框架自动完成服务注册. 例如,只要这样写,框架就会自动注册. public class Tax ...

  7. (动态模型类,我的独创)Django的原生ORM框架如何支持MongoDB,同时应对客户使用时随时变动字段

    1.背景知识 需要开发一个系统,处理大量EXCEL表格信息,各种类别.表格标题多变,因此使用不需要预先设计数据表结构的MongoDB,即NoSQL.一是字段不固定,二是同名字段可以存储不同的字段类型. ...

  8. c++对c的拓展_命名空间_简单使用

    名字的控制:c可使用static关键字使该关键字在本单元内可见,c++则使用命名空间对名字的可见性及产生进行控制 命名空间:控制标识符的作用域(本质上就是一个作用域) 使用特点:1.必须定义在全局范围 ...

  9. springboot静态资源无法访问

    前言 今天使用springboot+layui+shiro实现一个前后端分离的商城后台系统,一个小小静态资源(image)问题搞了一下午:还好坚持了下来,否者崩溃.吐血都是小事 这是引入的路径 这是图 ...

  10. 计算机系统6-> 计组与体系结构3 | MIPS指令集(中)| MIPS汇编指令与机器表示

    上一篇计算机系统5-> 计组与体系结构2 | MIPS指令集(上)| 指令系统从顶层讲解了一个指令集 / 指令系统应当具备哪些特征和工作原理.这一篇就聚焦MIPS指令集(MIPS32),看看其汇 ...