IE11 中未定义 Javascript 函数答案

【问题标题】：Javascript function is undefined in IE11IE11 中未定义 Javascript 函数
【发布时间】：2018-01-14 05:53:07
【问题描述】：

我写了一个示例 html 页面来显示一个弹出 div，它在 Firefox 中工作，但在 IE 中不工作。它说函数未定义。

这是我的页面：
并且错误消息是“'show_popup_div' is undefined”

<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=unicode" />

    <script type="text/javascript">

        function show_popup_div() {
            var imageDiv=document.getElementById("image_div");
            var switchA=document.getElementById("switch_a");
            imageDiv.style.display='block';
        }

        async function hide_popup_div() {
            var imageDiv=document.getElementById("image_div");
            await sleep(5000);
            imageDiv.style.display='none';
        }          

        function sleep(ms) {
            return new Promise(resolve => setTimeout(resolve, ms));
        }

    </script>
</head>
<body>

    <a id="switch_a" onmousemove="show_popup_div()" onmouseout="hide_popup_div()">click me to open a image</a>
    <div id="image_div">
        <img id="image" src="http://www.rd.com/wp-content/uploads/sites/2/2016/02/06-train-cat-shake-hands.jpg" usemap="#map1"/>

    </div>

</body>

我该如何解决这个问题？谢谢。

【问题讨论】：

How to make promises work in IE11的可能重复
IE11 不支持 async / await 语法。它仅支持 ECMAScript 5 和一些 ECMAScript 6 功能。

标签： javascript html

【解决方案1】：

我相信如果没有 Jaromanda X 提到的 Javascript 库，Promise 函数根本不兼容 IE。 https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Promise

【讨论】：

正确。 Promise 是一种比 IE 11 更新的技术。我建议改用 setTimeout。
这个答案非常具有误导性，问题不是使用 Promises，因为 IE11 可以将 Promises 与适当的库一起使用。但是，IE11 不支持 async/await 和箭头符号 =>，因为这是 javascript 中的语法更改，而不是缺少“内置”功能

【解决方案2】：

你不需要 JavaScript 来实现这个效果，你可以使用纯 CSS 使用 :hover 伪类和 + 相邻元素选择器：

#image_div {
    display: none;
}

#switch_a:hover + #image_div {
    display: block;
}

【讨论】：