由a标签点击事件引发的IE8翻车事故

共计 612 个字符，预计需要花费 2 分钟才能阅读完成。

起因
对于 a 标签的点击事件，也许我们早已习惯 href=”javascript:void(0);” 这样去写，之后绑定 click 事件来处理，但今天在 IE8 浏览器下某个页面遇到了很诡异的问题。如果我们点击了某个这个 a 标签，JavaScript 中的点击事件执行之后，页面中的 input 使用 $(‘input’).val() 等就取不到值了，使用 $(‘form’).serialize() 之后相关 input 的字段也没有值。由此展开了折腾之路。
折腾之路

使用各种方式取值，都没有获取到 input 输入框的值，一直以为是取值方式的问题，一直折腾无果，因为在其他浏览器下均正常。
如果不点击相关 a 标签，则可以获取到 input 输入框的值。
在另外的具有 placeholder 处理的页面中，点击 a 标签后，input 中的 placeholder 值没有了，因为 IE8 下的 placeholder 需要绑定相关事件，因此可以断定点击 a 标签之后，页面可能存在刷新。
果不其然，a 标签的 href 属性即便写为 javascript:void(0); 仍然会导致页面在 IE8 下进行某种机制的页面刷新操作。

解决方案
在每一个这种 a 标签的点击事件中，添加 e.preventDefault() 来阻止默认事件即可。
潜在风险
在添加这行代码之后，对于想跳转的有些 a 标签可能不能跳转了，那么需要再在事件下面对 href 进行判断，或者判断这个 href 是否符合直接跳转的条件，而分别进行阻止默认事件的处理。