将图像添加到弹出消息

Adding an image to a pop-up message

是否可以在 C# 中向弹出消息添加图像/ASP.Net?我有一个标准的弹出窗口编码如下:

ScriptManager.RegisterStartupScript(Page, Page.GetType(), "Data Entry", 
"alert('!!!!!ATTENTION !!!!! \r\n This is NOT the production version');", true);

我被要求添加停车标志或大感叹号或突出的东西的图像,我什至不知道是否可行。

我认为使用 JavaScript 警报功能是不可能的。但是,如果您使用任何基于 CSS 的 dialog/modal 框(例如,Bootstrap Modal, jQuery UI Dialog 等),它应该是可能的。列出所有可能的工具来执行此操作是愚蠢的,但只要知道它们都与我在下面 jQuery UI 对话框中显示的非常相似。

 $(function() {
        $( "#dialog" ).dialog({modal: true});
      });
<link href="https://code.jquery.com/ui/1.11.4/themes/ui-darkness/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>

<div id="dialog" title="Test System">
    <p>This ain't the production system!</p>
    <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/d/dd/Achtung.svg/2000px-Achtung.svg.png" style="height: 50px; width: 50px" />
</div>

您不能使用 javascript 警报功能添加 html。

A JavaScript alert is a simple window containing a message.

要实现您的需求,您必须使用用于对话框、弹出窗口等的库

您必须使用类似 jQuery & jQuery UI(标准示例)的内容。

这是一个使用 jQuery 和 jQuery UI 做你想做的事情的 jsfiddle:http://jsfiddle.net/5a833tjv/(jQuery 1.9.1 和 jQuery UI 1.9.2)

因此您需要添加以下内容html(示例):

<div id="dialog-message" title="Important information">
    <span class="ui-icon ui-icon-info" style="float:left; margin:0 0px 0 0;"></span>
    <div style="margin-left: 23px;">        
           !!!!!ATTENTION !!!!! \r\n This is NOT the production version
    </div>
</div>

并相应地修改您的启动脚本:

ScriptManager.RegisterStartupScript(Page, Page.GetType(), "Data Entry", 
"
$('#dialog-message').dialog({
    modal: true,
    draggable: false,
    resizable: false,
    position: ['center', 'top'],
    show: 'blind',
    hide: 'blind',
    width: 400,
    dialogClass: 'ui-dialog-osx',
    buttons: {
        'I've read and understand this': function() {
            $(this).dialog('close');
        }
    }
});


", true);