jQuery UI Dialog 小部件是不是有 Vanilla JS 替代品[关闭]

Posted 2023-05-08

【中文标题】jQuery UI Dialog 小部件是不是有 Vanilla JS 替代品[关闭]

【英文标题】：Is there a Vanilla JS alternative for the jQuery UI Dialog widget [closed]jQuery UI Dialog 小部件是否有 Vanilla JS 替代品[关闭]

【发布时间】：2019-04-23 01:41:11

【问题描述】：

jQuery UI 提供的对话框小部件是否有 Vanilla JS 替代品？ 它至少应该允许包含任意标记，因此警告或提示不是一个选项。

【问题讨论】：

alert, prompt, confirm

互联网上到处都是javascript对话框/灯箱。

有native html5 <dialog> element，但在几个重要平台上不支持。

我建议制作一个。这很容易做到，应该不会超过 30 分钟。我建议创建一些功能。一个函数来保存你的结构，用一个参数来提供你的内容和你需要的对话框的任何条件。事件的另一个功能，例如您的点击事件、滚动、加载、拖动、调整大小等。第三个可能用于您可能需要的任何 ajax。您甚至可能需要第四个，具体取决于您如何处理初始化模态。最后，你的 CSS。一个简单的模式将具有基本的 HTML 结构 - 通常是标题栏、内容正文，如果需要，还有页脚。

如果你想要一个灯箱，方法类似于模态，除了你通常不想要拖动之类的东西，它通常有背景。否则，方法非常相似。

【参考方案1】：

仅在一定程度上。您可以使用alert、prompt 或confirm 对话框（作为window 对象上的函数实现），但它们不能在不同的浏览器之间设置样式和看起来不同。

当然可以使用 vanilla JS 创建一个特殊的模式/对话框。它有多难取决于您想要/需要它具有的功能。