需求:
由於公司項目對於ie瀏覽器只支持ie10及以上版本,爲了更好的用戶體驗及人性化提示,想在代碼裏判斷下ie瀏覽器低版本加個提示。
解決方案:
先貼代碼:
<!--[if lte IE 9]>
<script>
alert("您正在使用的瀏覽器版本過低,爲了您的最佳體驗,請先升級瀏覽器。");
window.location.href="http://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href);
</script>
<![endif]-->
將這段代碼放在html文件的head標籤內即可。
我公司這個項目是vue-cli構建的單頁面應用,所以就貼在了項目工程根目錄的index.html裏,非單頁面應用可以貼在登錄頁裏。
例如我的index.html是這樣滴:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<title></title>
<!--[if lte IE 9]>
<script>
alert("您正在使用的瀏覽器版本過低,爲了您的最佳體驗,請先升級瀏覽器。");
window.location.href="http://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href);
</script>
<![endif]-->
</head>
<body>
<div id="app"></div>
</body>
</html>
拓展
以上是針對ie9及以下版本,
針對ie8及以下版本只需把9換成8即可,
針對ie10及以下版本使用:
<script>
/*@cc_on
alert("您正在使用的瀏覽器版本過低,爲了您的最佳體驗,請先升級瀏覽器。");
window.location.href="https://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href);
@*/
</script>