setInterval循环问题？？？？

<script>
    var obj=$('div'); 
	
    obj.click(function(){  
        var cnt = 50; 
        var i=0;
        var timer = setInterval(function(){
        	i++;
            //debugger;
        	if(i>=cnt) {
	        	clearInterval(timer);
	        } 
            console.log(i);
        }, 10);
    }); 
    
    function play() {
        clearInterval(timer);
        var timer = setTimeout(function(){
            obj.click();
            play();
        }, 5000);
    }
    play();
</script> 

问题描述： 在body中只有一个div，绑定一个点击事件。点击事件是用来打印1-50，自动循环执行

当打开这个文件，打开控制台查看时，每隔5000ms正常输出1-50,。但是当我打开一个新的页面，在浏览这个页面时，之前测试页面的控制台中打印出错。

出错原因：一些新版本的浏览器的 setTimeout和setInterval的确做过优化。就是tab进入后台后，定时器会在一段时间后停止工作。其实这个机制对普通的定时动画效果的影响是极小的，因为tab激活后定时器还会再次激活。对于只是定时，而对时间敏感度不高的应用来说（动画，切换）等，中断再执行没有任何影响。

但是我上面这段代码的目的是为了定时触发click事件，所以tab切换也不能中断。暂时还没有好的解决方案。