js定时刷新局部页面及动态加载页面后事件处理

最近在做项目的过程中用到了定时刷新页面元素，就类似公交车软件一样，定时读取实时状态，期间遇到了一些奇葩的问题，在此列出供需要的朋友参考，同时也作为本阶段工作的一个小结，具体问题如下：

1. 定时刷新页面

该部分处理有多种方式：

典型的处理有整个页面刷新，

方法一： <meta http-equiv="refresh" content="5">  

方法二：定时器刷新：

setInterval('myrefresh()',10000);  //指定10s刷新一次

function myrefresh() {

window.location.reload();

}

在本项目中由于刷新整个页面体验非常的不好，所以选择方法二 只刷新页面中的局部DOM，这将导致一个问题就是动态加载页面后虽然表面上看起来与未加载前一样，但是实质上却有很大的区别，最明显的体验是绑定的click事件在定时刷新后不起作用了，这是因为事件无法绑定在新载入的DOM上，此时就需要进行事件委托处理，可使用如下方式解决：

$('.bookflag').click(function() { ... }); //正常页面处理方式

$(document).on('click','.bookflag',function(){... }); //动态加载DOM后使用此方式

通过使用以上方式，上述问题可以完美得到解决；

2. 苹果手机不起作用

经过第一步的修改在电脑上很顺畅的测试完毕，此时才发现一个苦逼的事情已然发生了，系统在安卓手机和电脑上都可以响应事件，但是在苹果手机设备上缺丝毫不起作用，于是乎翻遍各个角落终于求得一个解决方式，需要将绑定事件的元素进行一下css设置，具体为什么要进行这样的设置本人还暂不清楚：

.bookflag {
      cursor:pointer
    }

以上即为本次功能开发遇到的具体问题，希望能帮助到你们，共同进步，不喜勿喷！