JS对于Android和IOS平台的点击响应的适配

综述

最近做项目的时候发现了一个非常奇怪的问题，就是对于click事件的响应。经过测试发现，对于IOS平台，直接监听click事件可能是没有响应的，而在Android和PC上则完全没有问题。所以通过获取设备信息实现了不同平台的不同监听。

IOS监听

对于IOS设备，只监听click方法可能是没有响应的。解决方法就是监听 “touchend click”事件。

而对于Android和PC，则只监听click事件即可。

平台检测

我们利用userAgent来检测平台

1 2 3 4 5 6 7 8 9

if ( /(iPhone|iPad|iPod|iOS)/i . test ( navigator . userAgent ) ) {      //alert(navigator.userAgent);        alert ( "iOS" ) ; } else if ( /(Android)/i . test ( navigator . userAgent ) ) {      //alert(navigator.userAgent);      alert ( "Android" ) ; } else {      alert ( "PC" ) ; } ;

上面的JS代码可以检测三个平台。

实现监听

我们可以把方法自定义名字，比如

1 2 3 4 5

function back_click ( ) {          $ ( ".group-names" ) . show ( ) ;          $ ( ".groups:visible" ) . hide ( ) ;          $ ( this ) . hide ( ) ;      }

然后跨平台实现监听

1 2 3 4 5 6

/* bind the event */      if ( /(iPhone|iPad|iPod|iOS)/i . test ( navigator . userAgent ) ) {          $ ( ".back" ) . bind ( { "touchend click" : back_click } ) ;      } else {          $ ( ".back" ) . bind ( { "click" : back_click } ) ;      }

通过以上监听便没有问题了。

总结

通过以上方法便可以实现不同平台的监听。

转载请注明：静觅 » JS对于Android和IOS平台的点击响应的适配