将图像添加到弹出消息
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);
是否可以在 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);