使用mui框架后a标签无法跳转
由于最近工作项目上使用到前台mui框架,笔者在将H5转换为jsp时,遇见各种各样问题,原因归结为对mui框架不熟悉,今天就遇见一个特别奇怪的问题,界面中超链接<a>标签无法跳转,笔者试着添加点击事件,但效果依然是无法跳转,查资料发现mui搞得鬼;
我的代码主要是下边代码搞得鬼:
//删除出行人
mui('body').on('tap','.business_icon_remove',function(){
var parentNode_1 = this.parentNode,
parentNode_2 = parentNode_1.parentNode,
removeNode = parentNode_2.parentNode,//获取要删除的节点
fatherNode = removeNode.parentNode;//获取要删除节点的父节点
if (hasClass(removeNode,'mui-media')) {
mui.alert('确定要删除该员工?',function(){
fatherNode.removeChild(removeNode);
})
}else if(hasClass(removeNode,'business_remove_invoice')){
mui.alert('确定要删除该发票?',function(){
fatherNode.removeChild(removeNode);
})
};
});
mui('body').on('tap','.business_choose_time',function(){
var set_day = this.getElementsByClassName('business_time_day')[0];
var set_hour = this.getElementsByClassName('business_time_hour')[0];
/*
* 首次显示时实例化组件
* 示例为了简洁,将 options 放在了按钮的 dom 上
* 也可以直接通过代码声明 optinos 用于实例化 DtPicker
*/
//设置日期控件模式
var picker = new mui.DtPicker();
picker.show(function(rs) {
/*
* rs.value 拼合后的 value
* rs.text 拼合后的 text
* rs.y 年,可以通过 rs.y.vaue 和 rs.y.text 获取值和文本
* rs.m 月,用法同年
* rs.d 日,用法同年
* rs.h 时,用法同年
* rs.i 分(minutes 的第二个字母),用法同年
*/
set_day.innerText = rs.y.text + '-' +rs.m.text + '-' + rs.d.text;
set_hour.innerText = rs.h.text + ':' + rs.i.text;
/*
* 返回 false 可以阻止选择框的关闭
* return false;
*/
/*
* 释放组件资源,释放后将将不能再操作组件
* 通常情况下,不需要示放组件,new DtPicker(options) 后,可以一直使用。
* 当前示例,因为内容较多,如不进行资原释放,在某些设备上会较慢。
* 所以每次用完便立即调用 dispose 进行释放,下次用时再创建新实例。
*/
picker.dispose();
}, false);
});
其实在这里使用mui框架,来实现界面的数据删除和时间的选择两个功能,添加下边代码就可以解决问题:
mui('body').on('tap','a',function(){
window.top.location.href=this.href;
});
以上叙述经笔者亲自验证,也可能朋友们是其他原因导致的,但使用mui框架,类似问题,应该都可以解决!
使用mui框架后a标签无法跳转的更多相关文章
- mui框架中底部导航的跳转1
mui框架极大的方便了app的开发但是我们在做页面之间的切换时发现不能实现 a 链接的跳转,这是应为mui相关的一些控件是通过拦截a标签上的href来实现的,所以mui.js会阻止a标签上的href跳 ...
- mui框架中底部导航的跳转2
接上一篇 还有一种方法就是在一心得页面中打开我们所需要的网页 代码如下: 向新的的页面穿值: 获取到新页面上的值:
- MUI框架开发HTML5手机APP(二)--页面跳转传值&底部选项卡切换
概 述 JRedu 在上一篇博客中,我们学习了如何使用Hbuilder创建一个APP,同时如何使用MUI搭建属于自己的第一款APP,没有学习的同学可以戳链接学习: http://www.cnblo ...
- MUI框架-10-MUI 数据交互-跳转详情页面
MUI框架-10-MUI 数据交互-跳转详情页面 上一篇介绍了如何实现数据交互,给别人的 API 发送 ajax 请求,我们得到数据,再使用 art-template 模板引擎拼接 HTML,最终实现 ...
- 解决MUI阻止a标签默认跳转事件—方法总结
用过mui的小伙伴们一定不会陌生,有时候真的很烦mui本身会阻止a标签默认跳转.一般只要用了mui的ui组件,比如头部,底部或者弹框,你就不能在用a标签进行跳转了. 注:项目中引用了mui后,可能也会 ...
- 移动端 mui框架中input输入框或任何输入框聚焦后页面自动上移
一.mui框架中点击input后,安卓手机弹出自带的输入键盘时,页面自动上移 实现方法: (1)只要把input标签放在mui-content这个类里面就可以了 <div class=" ...
- 使用iframe框架后的页面跳转时目标页面变为iframe的子页面的问题
<frameset rows="4,200,10,*,120" cols="*" framespacing="0" framebord ...
- 跨平台移动端APP开发---简单高效的MUI框架
MUI是dcloud(数字天堂)公司旗下的一款跨平台开发移动APP的框架产品,在学习MUI框架之前,最先接触了Hbuilder代码编辑器,它带给我的第一感觉是快,这是HBuilder的最大优势,通过完 ...
- MUI框架开发HTML5手机APP(一)--搭建第一个手机APP
前 言 JRedu 随着HTML5的不断发展,移动开发成为主流趋势!越来越多的公司开始选择使用HTML5开发手机APP,而随着手机硬件设备配置的不断提升,各种开发框架的不断优化,也使着H5开发的 ...
随机推荐
- Eclipse导出apk
http://jingyan.baidu.com/article/7908e85c8dea30af491ad24f.html
- 碰到错误Could not load the Tomcat server configuration at \Servers\MyEclipse Tomcat v8.5-config. The Servers project is closed.
本人用的myeclipse是2017版. 可能解决的方法是: 双击MyEclipse Tomcat v8.5,然后就会弹出以下窗口,
- ComboBoxStyle和ToggleButton
<Style x:Key="ComboBoxStyle" TargetType="{x:Type ComboBox}"> <Setter ...
- 倒置字符串函数reverse
倒置字符串函数reverse:用于倒置字符串s中的各个字符的位置, 如原来字符串中如果初始值为123456,则通过reverse函数可将其倒置为654321, 程序如下: #include<st ...
- vue组件父子组件传递引用类型数据
今天在写分页功能时,发现父子组件传值时,子组件监听不到父组件中数据的变化,传递的是一个引用类型的数据 其原因是引用类型共用一个内存地址,父子组件用的是同一个对象,故子组件监听不到变化,此时就需要做一个 ...
- 通过 objc_setAssociatedObject alert 和 button关联 及传值
原文地址 http://blog.csdn.net/lengshengren/article/details/16886915 //唯一静态变量key static const char associ ...
- opencv中VideoCapture和cvCapture有什么区别?
VideoCapture和cvCapture其实是一样的,你可以去看看源码,VideoCapture其实在内部调用了cvCapture.这是不同 版本的opencv导致的.我接触到的opencv有过一 ...
- https页面 和 http请求的问题
(1)强制升级http 静态资源地址为https地址 https页面中不能使用http请求,http页面中可以使用https请求. 关于在https 页面有一些http的请求,可以在<head& ...
- C#面向对象(三):多态
前文链接: C#面向对象(一):明确几个简单的概念作为开胃菜 C#面向对象(二):封装和继承 今天来聊聊面向对象的多态,这部分算是比较重要和核心的,很多工作2年多的程序员其实对于面向对象和多态的理解也 ...
- expect 切换用户
安装expect yum install expect -y #!/bin/expect -f spawn su - expect "Password:" send "n ...