我正在忙于创建管理面板。这些管理面板包括各种表格，模态和对话框，并通过AJAX提交数据。当服务器遇到错误时，它将错误作为“数据”发送回AJAX请求，然后必须将其显示出来。我正在寻找一种在屏幕上显示错误消息“浮动”几秒钟的方法。这必须在屏幕上所有内容（包括打开的模式）的顶部弹出。
一种做到这一点的方法是JavaScript警报，但这对用户/移动设备不友好。另一种方法是通过模态/对话框，但是如果模态/对话框已经打开，则此方法不起作用。简而言之，我正在寻找一种在屏幕中央显示“浮动div”的方法，无论用户滚动到页面上的哪个位置或当时打开的是什么模态/对话框。
您可以在ajax响应回调中创建一个元素：
$.ajax({
url: "your-script.php",
done: function(response) {
// set the message to display: none to fade it in later.
var message = $('<div class="alert alert-error error-message" style="display: none;">');
// a close button
var close = $('<button type="button" class="close" data-dismiss="alert">×</button>');
message.append(close); // adding the close button to the message
message.append(response); // adding the error response to the message
// add the message element to the body, fadein, wait 3secs, fadeout
message.appendTo($('body')).fadeIn(300).delay(3000).fadeOut(500);
}
});
和CSS：
.error-message {
position: fixed;
top: 45%;
left: 50%;
margin-left: -150px;
width: 300px;
z-index: 9999;
}
调整z索引将消息显示在最前面。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句