JAVA js里弹出消息提示框

Posted 2023-05-17

这种带感叹号，确定、取消一 齐的提示框，应该用什么啊. alert()只有确定,confirm的提示图片是问号. 用jquery,能实现的了这种灰色、厚重的感觉嘛？ 客户发来的图是感叹号，我没注意就用了问号. 客户死活不同意. 我去......。我看好像最接近的就是用VB写了。 可是，我们的这个项目校验都是写在一个js里的。 在js里能用vb不？ 怎么实现啊。这种提示框. 必须是那种.

用extjs吧，Ext.MessageBox.Warn("修改配置数据会导致系统崩溃，确认继续？",warnModify);
实现的就是你这种效果。
你只需要在你的html中引入extjs相关的代码就可以了。
<script language="javascript">
document.write("<link rel=\"stylesheet\" rel=\"text/css\" href=\"../../../ext/resources/css/ext-all-cdn.css?rnd=" + Math.random() + "\"><\/link>");
document.write("<link rel=\"stylesheet\" rel=\"text/css\" href=\"../style/ext-alarm.css?rnd=" + Math.random() + "\"><\/link>");
document.write("<script type=\"text/javascript\" src=\"../../../ext/adapter/ext/ext-base.js?rnd=" + Math.random() + "\"><\/script>");
document.write("<script type=\"text/javascript\" src=\"../../../ext/ext-all.js?rnd=" + Math.random() + "\"><\/script>");
</script>
extjs的包可以官网上下到。追问

哥们,提示无warn方法啊。 而且，按钮还是英文的。 ext我不了解

追答

不好意思，warn方法是包装过的：
Ext.MessageBox.warn= function(title, msg, fn, scope)
this.show(
title : title,
msg : msg,
buttons : this.OKCANCEL, //替换成你需要的按钮
fn : fn,
scope : scope,
icon : this.QUESTION //这里可以替换成！图标
);
return this;


Ext.Msg.warn('标题', '消息'); );

参考技术A <script language="vbscript">
n=msgbox("弹出信息行1"&vbCrlf&"弹出信息行2",49,"Title信息")
</script>

vbscript这么做追问

那在JSP中，怎么才能在需要的时候调用呢， 比如，用JS的话，就有onclick.

js消息提示框插件-----toastr用法

 （本文系转载）

因为个人项目中有一个提交表单成功弹出框的需求，从网上找了一些资料，发现toastr这个插件的样式还是不错的。所以也给大家推荐下，但是网上的使用资料不是很详细，所以整理了一下，希望能给大家带来帮助。

toastr

官网http://codeseven.github.io/toastr/

这个样式插件支持直接导cdn入链接，但是我尝试了一下cdn加载速度太慢，所以推荐直接下载文件后导入文件

个人演示地址，因为把js放在了头部所以加载时间可能有点长，而且我发现自己的服务器不是很稳定，所以多多包涵。

http://47.94.153.112/

整个过程共分为４ 步

1.导入文件

2.页面中头部导入插件

3.配置样式

4.编写触发方式

1.导入文件，这是我测试的文件

2.页面头部导入插件，必须导入jQuery，因为toastr是依赖于jQuery的

3.配置样式，默认样式就已经不错，主要配置弹出位置positionClass这一项，主要有top,bottom以及修饰它们的right，left，center这几个关键词。

<scripttype="text/javascript">

$(function(){

toastr.options= {

"closeButton":false,//显示关闭按钮

"debug":false,//启用debug

"positionClass":"toast-top-center",//弹出的位置

"showDuration":"300",//显示的时间

"hideDuration":"1000",//消失的时间

"timeOut":"5000",//停留的时间

"extendedTimeOut":"1000",//控制时间

"showEasing":"swing",//显示时的动画缓冲方式

"hideEasing":"linear",//消失时的动画缓冲方式

"showMethod":"fadeIn",//显示时的动画方式

"hideMethod":"fadeOut"//消失时的动画方式

};

$("#success").click(function(){

toastr.success("成功样式");

})

$("#info").click(function(){

toastr.info("提示样式");

})

$("#warning").click(function(){

toastr.warning("警告样式");

})

$("#error").click(function(){

toastr.error("错误样式");

  //带标题的消息框
 toastr.success("你有新消息了!","消息提示");
  
  //另一种调用方法
 toastr["info"]("你有新消息了!","消息提示");

})

$("#clear").click(function(){

toastr.clear();//清楚当前页面弹出框

})

});

</script>

4.编写触发方式，因为JS中已经配置了onclick的触发方式，所以直接用button测试了，当然js的触发方式很多，可以按需选择。为了方便查看我这里用bootstrap配置了按钮样式。

<buttonclass="btn btn-success" name="success"id="success"> 成功 </button>

<buttonclass="btn btn-info" name="info"id="info">提示</button>

<buttonclass="btn btn-warning" name="warning"id="warning">警告</button>

<buttonclass="btn btn-danger" name="error"id="error">错误</button>

<buttonclass="btn btn-primary" name="clear"id="clear">清除</button>

5.运行查看效果

一个静态的页面样式就这样配置好了。

如果需要给动态页面添加样式，只需要用JS配置一下接收就好了

function msg() {
var url=location.search;
if(url.indexOf("?") != -1) {
    var str=url.substr(1);
    strs=str.split("=");
    var a=strs[1];
}
if(a==1){
    toastr.success("操作成功");
}
if(a==2){
    toastr.warning("请稍后再试");
}
}

 

这是一个简单通过连接追加的参数显示的示例，当然还有很多除了连接参数的方式，比如JSP中直接获取一个对象值也是可以的。