___K
___K
  • 发布:2016-11-06 16:22
  • 更新:2016-11-06 16:22
  • 阅读:6690

解决plus.nativeObj.View页面切换,点击事件无效问题。

分类:HTML5+

下方有附件可直接下载使用。

页面一

HTML代码

<a class="_button" onclick="go()">Hbuilder</a>

CSS代码

._button{  
	padding:8px 10px;  
	background:#f60;  
	margin:50px auto;  
	display: block;  
	width:120px;  
	text-align:center;  
	color:#FFFFFF;  
	border-radius: 3px;  
}

JS代码

function plusReady(){  
	//创建底部图片  
	issue = new plus.nativeObj.Bitmap('bmp');  
	issue.load('images/footImg.png',function(){  
		console.log('图片加载完成!');  
		createView();  
	},function(e){  
		console.log('图片加载失败!'+JSON.stringify(e));  
	});  
}  
  
// 创建原生View控件  
function createView(){  
	view = new plus.nativeObj.View('FootImg',{top:'90%',left:'43%',height:'55px',width:'55px',background:'#f60'});  
	view.drawBitmap( issue, {top:'0px',left:'0px',width:'100%',height:'100%'}, {top:'auto',left:'auto',width:'100%',height:'100%'} );  
	view.show();  
	  
	view.addEventListener("click",ViewClick, false);  
}  
  
//View点击事件  
function ViewClick(){  
	alert('你点击的view');  
}  
  
if(window.plus){  
	plusReady();  
}else{  
	document.addEventListener("plusready",plusReady,false);  
}  
  
/* 页面切换  */  
function go(){  
	var subpage = mui.openWindow({  
		url:'list.html',   
		id:'list.html',  
	});  
	  
	//页面转场的时候清除掉view。  
	subpage.addEventListener('loaded', function() {  
		subpage.show('slide-in-right', 200, function() {  
            view.clear();  
        });  
    });  
}  
  
//监听list返回  
window.addEventListener('_title',function(){  
	//一监听到就可以创建View了,但是View的点击没用(事件应该是绑上了,用createView()的话会发现点击的时候会弹窗两次),应该是位置的问题吧。  
	view = new plus.nativeObj.View('FootImg',{top:'90%',left:'43%',height:'55px',width:'55px',background:'#f60'});  
	view.drawBitmap( issue, {top:'0px',left:'0px',width:'100%',height:'100%'}, {top:'auto',left:'auto',width:'100%',height:'100%'} );  
	view.show();  
	  
	// createView(); 这样写的话点击会被执行两次。  
	  
	//所以等待窗体动画到位在绑定事件  
	setTimeout(function(){  
		view.addEventListener("click",ViewClick, false);  
	},400);  
});

页面二

JS代码

$('._back').on('tap',function(){  
	mui.init({  
    	beforeback: function(){  
//			var viewPage = plus.webview.getWebviewById('view.html'); //如果不是首页面就用这个获取指定ID,否则用下面的获取首页窗体;  
			var viewPage = plus.webview.getLaunchWebview();  
			mui.fire(viewPage,'_title',{/* 这里可以传值  */});  
			return true;  
		}  
    });  
    mui.back();  
})
1 关注 分享
1***@qq.com

要回复文章请先登录注册

w***@163.com

w***@163.com

需要设置view的监听标记属性。view.interceptTouchEvent(true);加上这句话就可以了。
2017-03-30 17:41
1***@qq.com

1***@qq.com

表示,创建了一个原生的view控件后 然后监听了click事件,,点击没有效果,根本都没有进入监听的执行事件。
2017-03-17 15:36
gadget2k

gadget2k

你好,我就在一个页面上都没有跳转,view就不响应点击。默认不是应该截取点击时间的吗。请问响应点击的重点是要做些什么?
2017-02-13 16:08