MUI+html5+script 不同页面间转跳(九宫格)
2024-09-08 10:01:51
在点击图片/标题需要跳转到详情页面的使用场景中,首先定义图片元素的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>
最新文章
- java IO输入输出流中的各种字节流,字符流类
- JVM内存配置
- arguments.callee 调用函数自身用法----JSON.parse()和JSON.stringify()前端js数据转换json格式
- 【设计模式 - 23】之模版方法模式(Template)
- javascript焦点图(能够自己主动切换 )
- Entity FrameWork 实体属性为decimal时默认只保存2位小数
- 1084:XX开公司<;回溯>;
- Java基础学习笔记二十三 Java核心语法之反射
- java web--DOM
- HTML图片标签路径解析
- 【LR9】【LOJ561】CommonAnts 的调和数 数论 筛法
- 数据库导出sql
- 导入mysql报错问题
- 【转】mybatis如何防止sql注入
- 【问题记录系列】the resource is not on the build path of a java project
- (转)Secondary NameNode的作用
- 关于多重嵌套的JSON数据解析
- html页面pc显示正常,在手机端适配也可以看整个页面
- 我把双系统的win10抹除了现在开机只按option还是会出现双系统选择,怎么把那个win10给取消了或删除掉
- Sql数据库收缩 语句特别快