Android-WebView集成iScroll4之input框无法获取焦点

最近给公司做一个企业App,Android客户端+Java服务端,总共有十几个模块,其中有几个模块就是从服务端查询数据,手机上的功能有列表展示及下载附件。

?

我是做Java服务端开发的,不会Android,另外有android开发人员,经过讨论决定这块手机直接访问Java服务端(Java web系统)的页面,源自于开始给公司一个pad应用,也是光查询数据用,采用的是Android的webview访问web的一个url。

?

其实webview这种做法,最简单,省事,省成本,不用纯Android开发,web页面能访问,没问题,拿到手机上,或pad上测试——基本没什么大问题,有的话也是些css,js兼容性的问题。

?

所以这个功能我很快就在服务端开发完了,就是为了样式和兼容性,引入了jQuery-1.9.1,jquery.mobile-1.3.2。页面上一个文本输入框,可以输入标题进行查询,下面展示的就是列表。在手机上也测试了,大部分手机都没问题。

?

后来,交给测试部测试,人家来个压力测试,才1000多条数据,直接就死掉了,因为这个列表没有做分页功能。好了,加分页吧,关键是手机上分页得下拉刷新那种,怎么做,上网一搜,发现都在用开源的iScroll,网上有很多例子,后续也会专门来写这块,所以很快就加入到项目中,分页效果还不错,下拉刷新,上拉加载更多数据。

?

但是迎来的第一个问题就是那个input输入框怎么都没有焦点,压根不能输入,这必须得解决啊,开始没去网上搜,觉得是个小问题一会儿就能搞定,最后发现不是这么回事。我开始解决办法是页面加载完成后写js让input获得焦点就是设置focus方法了,电脑上好使,手机上不好使。后来Android开发人员说,它在Android端能够调我页面的js方法,这样好啊一试,发现有些手机上好使了,但是有些还是不好使。没办法,我把js一层一层过滤发现是iScroll的问题,只要把这个加载进来就不好使,去掉就好使,带着这个问题再上网搜,晕,发现网上到处是这个问题,而且解决办法千篇一律,就是让iScroll过滤input等html标签:

onBeforeScrollStart: function (e) {
				var target = e.target;
				while (target.nodeType != 1) {
				target = target.parentNode;
				}
				if (target.tagName != ‘SELECT‘ && target.tagName != ‘TEXTAREA‘ && target.tagName != ‘INPUT‘) {
				e.preventDefault();
				}
			},

?重写这个方法,加上要过滤的标签input等。

按照这个改了后,发现电脑上好使,我用的chrome最新的39,专门为开发webview页装的,手机上还是不行,找了半天原因,还是不知道哪出问题。后来测试版本升级,给卸了重新安装,再测,发现好了,突然明白了是手机上缓存的原因。缓存啊,一直都在关注浏览器的缓存,忽视了手机上的缓存,还是手机开发做的少啊。

?

?

?

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。