记录下前段时间的项目遇到的一个IE下backSpace跳转的问题吧。。。
在iE浏览器下浏览同一个窗口内的多个页面，如果你按下backSpace键，它默认会帮你返回上一个页面。
因为项目中用到有readOnly状态的输入框，而且IE竟然还还让它获得焦点，（Chrome浏览器下是不可以获得焦点的，可以试试看哦）这样就给用户一种可以修改值的错觉，然而不是，你按下回格键，它给你跳转画面了，So,为了提升用户的使用体验，要禁止这种行为。
先看下图吧，这是IE下的效果，如果你是客户，你觉得能改值嘛，肯定想试试的吧
贴下代码吧：
function handleInputReadOnlyJumpifIE() {
springfield.require('IS_IE');
if (!springfield.IS_IE) {
return;
}
$('form').on('keydown keypress', function() {
var event = window.event;
var target = event.srcElement;
if ( event.keyCode != 8 ) {
return;
}
if ( (target.matches('input') || target.matches('textarea') ) && target.readOnly == true ) {
return false;
}
})
}
首先整理下思路，分几个步骤
1.既然是IE下才有的行为，那么只需要判断是否在IE浏览器下运行，如果是，禁止其行为就OK了。代码中的 springfield.IS_IE 其实是内部封装的判断IE的方法，至于怎么判断浏览器，可以百度下。
2.监听事件触发，做相应的处理。因为这些输入框都是在表单内的，所以我用JQ监听form的 keydown,和keypress 事件。做了一系列的判断。其中matches()方法，有兼容性问题，不过还好公司的代码库有做了相关的polyfill,用起来很方便。如果不用这个，使用nodeName()方法也可以的。
我这里只是禁掉了input和textarea 标签下的跳转行为，因为老大说，说不定有些客户会喜欢IE下的跳转功能呢。。。所以画面上其他地方使用还是可以跳转的。
