1.描述
用的bootstrap框架,但是整体风格跟bootstrap风格相差很大,需要自己定义一个提示框。
2.代码
css:
.succAlert {
display: none;
position: absolute;
top: 50%;
left: 35%;
width: 20%;
height: 5%;
width: 35%;
padding: 5px;
text-align: center;
font-size: 16px;
color: green;
background-color: rgb(242,242,242);
font-weight: bold;
}
.errorAlert {
display: none;
position: absolute;
top: 50%;
left: 35%;
width: 20%;
height: 5%;
width: 35%;
padding: 5px;
text-align: center;
font-size: 16px;
color: crimson;
background-color: rgb(242,242,242);
font-weight: bold;
}
javascript:
$.ajax({
type: "POST",//方法类型
contentType:‘application/json‘,
dataType: "json",//预期服务器返回的数据类型
url: "http://localhost:8080/saveRBD",//url
data: JSON.stringify(list),
success: function (data) {
console.log("成功");
mySuccAlert("保存成功!");
},
error: function (result) {
console.log("失败");
myErrorAlert("添加失败,请稍后重试!");
}
});
function mySuccAlert(str) {
var div = ‘<div class="succAlert"></div>‘;
$(‘body‘).append(div)
$(‘.succAlert‘).html(str);
$(‘.succAlert‘).show();
setTimeout(function() {
$(‘.succAlert‘).hide();
$(‘.succAlert‘).remove();
}, 2000)
}
function myErrorAlert(str) {
var div = ‘<div class="errorAlert"></div>‘;
$(‘body‘).append(div)
$(‘.errorAlert‘).html(str);
$(‘.errorAlert‘).show();
setTimeout(function() {
$(‘.errorAlert‘).hide();
$(‘.errorAlert‘).remove();
}, 2000)
}
3.结果


其实感觉也没有好看到哪去。。。
原文:https://www.cnblogs.com/smxbo/p/13160514.html