如何使用 JavaScript 将图像插入 alertify.js alert

How to insert an image into an alertify.js alert with JavaScript?

本文关键字：alertify js alert 插入 图像 何使用 JavaScript      更新时间：2023-09-26

我想创建一个带有大图像和确定按钮的弹出对话框，为此我正在尝试自定义alertify的警报.js

。

我的想法是使用默认图像 url 为所有这些"弹出警报"创建一个自定义css类，然后在我创建弹出窗口时将 url background-image: url(images/level_10.jpg);更改为带有 JavasScript 的正确图像(因为您可以在调用函数时传入自定义cssClass(;

我不确定这是否可能。

或者是否有更好的方法来自定义警报.js来实现这一点？

您可以覆盖 alertify 的 CSS 类。

看看下面的例子：http://www.fabien-d.github.io/alertify.js/assets/js/lib/alertify/alertify.bootstrap.css

在您的情况下，您只想像这样覆盖.alertify CSS 类：

.alertify.popup1 {
    background: url(path/file1.png);
}
.alertify.popup2 {
    background: url(path/file2.png);
}
/* etc */

并像这样使用Javascript：

$("alert1").onclick = function () {
 alertify.alert("This is an alert dialog", function() {}, 'popup1');
};
$("alert2").onclick = function () {
 alertify.alert("This is an other alert dialog", function() {}, 'popup2');
};

检查此小提琴以获取工作示例;)

相关文章：