移动端h5页面点透问题

用的是zepto.js

一个页面分三个tab， 通过隐藏，显示div来展示不同的数据。

A tab页面：已开通基金列表数据， 当没有数据时，会显示一个跳转到B tab页面的a标签

B tab页面： 未开通的基金列表数据，可以点击列表以选中/取消 基金

 点击A tab页中的a元素 触发该元素的touchend事件， 跳转到B tab页面。 B tab页面中是基金列表， 可以选中或取消！

解决方式一：  a元素的touchend事件中， 给B tab中的基金列表添加禁止鼠标事件， 过一定时间后在恢复鼠标事件。 公司框架的使用方式：

	$.bindEvent($("a"), function(){
	    $(_pageId+"#unopen").click(); //  隐藏A tab页的内容， 显示B tab页的内容
            //防止点击穿透， 过后需要将元素回复可点击
            $(_pageId+"#unopenList").css('pointer-events','none');
            setTimeout(function(){$(_pageId+"#unopenList").css('pointer-events','all')},500)
	    
	}, "touchend");

解决方式二：

第一种方式， 第一次进入这个页面是有效的，测试时发现，退出重新进入这个页面 可能还是会发生点透事件， 后来修改为以下方式（我也不知道这种方式的原因）

	$.bindEvent($("a"), function(){
		setTimeout(function(){$(_pageId+"#unopen").click();},350); //延时一段时间在切换显示内容， 延时时间要大于300。 300ms移动端click延迟时间
	}, "touchend");