IE点击子div,父div不获取焦点问题的解决办法（一）

原始需求：父div上面有tabindex="0"，点击子div，子div获取焦点，这个时候，希望父div也获取焦点。

这个在Chrome，FF浏览器上均表现正常，唯独IE环境不好用，困扰了许久，花费大约一天时间，尝试过各种办法，比如JS脚本，focus()方法，阻止冒泡事件，增加div蒙层，嵌套层级等等，都不能解决，也不是最理想的办法。最后还是stackoverflow上搞定问题。

Demo在这里链接。

样例代码如下：

IE浏览器下的代码行为特别怪异，让人费解，不知道是不是bug，但感觉不像，总之你可以在你的浏览器环境试验下，唯独IE不管用。

解决的办法：

通过事件机制或者js脚本或引起许多问题，尝试使用默认表情比如"div","span"在IE环境下就会出现这个状况，但换成自定义的标签，比如自定义“foo”或者像"var"这样，IE就能够表象的很正常。还是看代码，在这里。

附上问题记录：在这里。

=====================================================================

结合项目环境，vuejs

有两种办法可以实现：

1.使用var标签，比较简便。如果考虑H5标签的语义化，容易混淆，最好写上注释。

2.自定义标签，其实就是自定义组件foo，只不过组件里面仅设置样式display:block，然后用foo替换div即可。

=====================================================================

更新：后续内容，新的结论在这里

前端新手，经验欠缺，如您有幸路过此地，还请多多指教。

随意转载请注明出处及作者sotower

http://blog.csdn.net/sotower/article/details/69396530