模态窗体
重要性：5
创建一个函数 showPrompt(html, callback)，该函数显示一个带有消息 html、一个输入字段和按钮 OK/CANCEL 的表单。
- 用户应该在文本字段中输入一些内容，然后按 Enter 或 OK 按钮，然后
callback(value)将使用他们输入的值被调用。 - 否则，如果用户按 Esc 或 CANCEL，则
callback(null)被调用。
在这两种情况下，都会结束输入过程并移除表单。
需求
- 表单应位于窗口的中央。
- 表单是模态的。换句话说，在用户关闭它之前，无法与页面上的其他部分进行交互。
- 当表单显示时，焦点应位于
<input>内，以便用户使用。 - 键Tab/Shift+Tab应在表单字段之间切换焦点，不允许其移至其他页面元素。
使用示例
showPrompt("Enter something<br>...smart :)", function(value) {
alert(value);
});iframe 中的演示
P.S. 源文档包含带有固定定位的表单的 HTML/CSS，但您可以自行将其设置为模态。
可以使用一个半透明的<div id="cover-div">来实现模态窗口，该窗口覆盖整个窗口，如下所示
#cover-div {
position: fixed;
top: 0;
left: 0;
z-index: 9000;
width: 100%;
height: 100%;
background-color: gray;
opacity: 0.3;
}由于<div>覆盖了所有内容，因此它会接收所有点击事件，而不是下面的页面。
我们还可以通过设置body.style.overflowY='hidden'来阻止页面滚动。
表单不应位于<div>中，而应位于其旁边，因为我们不希望它具有opacity。