创建一个消息提示方法
/*** 弹出消息提示框，采用浏览器布局，位于整个页面中央，默认显示3秒* 后面的消息会覆盖原来的消息* @param message：待显示的消息* @param type：消息类型，0：错误消息，1：成功消息*/function showMessage(message, type) {let messageJQ= $("<div class='showMessage'>" + message + "</div>");if (type == 0) {messageJQ.addClass("showMessageError");} else if (type == 1) {messageJQ.addClass("showMessageSuccess");}// 先将原始隐藏，然后添加到页面，最后以400毫秒的速度下拉显示出来messageJQ.hide().appendTo("body").slideDown(400);// 4秒之后自动删除生成的元素window.setTimeout(function() {messageJQ.show().slideUp(400, function() {messageJQ.remove();})}, 4000);}
css样式
.showMessage {padding: 10px 20px;border-radius: 5px;position: fixed;top: 15%;left: 50%;color: #ffffff;z-index: 999;transform: translate(-50%, 0);}.showMessageSuccess {background-color: #f0f9eb;border: 1px solid #E1F3D8;color: #67c23a;}.showMessageError {background-color: #fef0f0;border: 1px solid #fde2e2;color: #F76C6C;}
使用消息提示框
let data = {cellPhone: $("#phone2").val(),verifyCode: $("#authcode2").val(),password: $.md5($("#newpwd3").val()),passMd5ed: true}$.ajax({type: "put", // 请求方式contentType: "application/json",url: register + "v1/register", // 地址，就是json文件的请求路径dataType: "json", // 数据类型可以为 text xml json script jsonpdata: JSON.stringify(data),success: function(res) { // 返回的参数就是 action里面所有的有get和set方法的参数if (res.resultCode === "00000000") {// 成功消息showMessage("注册成功", 1);} else {// 失败消息showMessage(res.resultMsg, 0);}}});
