“This is the 15th day of my participation in the First Challenge 2022. For details: First Challenge 2022”
Internet explorer has become the past, but still the pain of heart wipe not to become developers, such as the project of our company are mostly government network project, in the process of business docking, they most systems are used in Internet explorer, and ie because its activex controls can support call hardware devices, such as a printer, So it still owns a large share in the government.
But most of our projects are based on VUE, and even VUE 2.x supports IE8 in some way;
So our approach is to provide a page to download Google Chrome and jump to it
Determine the Browser Version
When we open the page, we need to determine whether the browser is Google, Firefox or Internet Explorer;
As long as JavaScript is enabled in the browser, the Navigator object always exists
function IEVersion() { var userAgent = navigator.userAgent; Var isIE = userAgent.indexof ("compatible") > -1 && userAgent.indexof ("MSIE") > -1; Var isEdge = userAgent.indexof ("Edge") > -1 &&! isIE; Var isIE11 = userAgent.indexof ("Trident") > -1 &&userAgent.indexof ("rv:11.0") > -1; var isIE11 = userAgent.indexof ("Trident") > -1; if (isIE) { var reIE = new RegExp("MSIE (\\d+\\.\\d+);" ); reIE.test(userAgent); var fIEVersion = parseFloat(RegExp["$1"]); if (fIEVersion == 7) { return 7; } else if (fIEVersion == 8) { return 8; } else if (fIEVersion == 9) { return 9; } else if (fIEVersion == 10) { return 10; } else { return 6; Else if (isEdge) {return "edge"; //edge } else if (isIE11) { return 11; //IE11 } else { return -1; // Not Internet Explorer}}Copy the code
In index. HTML, we write a method to determine if it is IE and the version number of IE, call, if the version number matches, If we can jump to the corresponding page (IEVersion () = = 7 | | IEVersion () = = 8 | | IEVersion () = = 9) {window. The location. Href = ‘. / downGoogle. HTML ‘; } At this point, when we visit the page with ie7,8, and 9 browsers, we jump to downgoogle.html,
Please note that es6 syntax, such as const, let, etc., should not be used here because ie compatible versions are required.
download
For the downgoogle.html page, just use the A tag and put the server address of the Browser version.
<div class="main-content"> <h2> Sorry, your browser version is too old, Please upgrade or download the following browser </h2> <p> Windows </p> <ul> <li> <a href="./ 83.0.4103.97_chrome32_stabLE_windows_installer.exe" </a> </li> <li> <a href="./ 83.0.4103.97_chrome64_stabLE_windows_installer. exe" download> </li> </ul> </div>Copy the code
This, while having a slight impact on the experience, generally solves the initial inability to browse in IE8
Vue3. X is no longer compatible with IE versions, and in the future, pages like this transition will still exist in some units, until the old system update iteration is past, by which time there may be another ‘IE’