添加链接
link管理
链接快照平台
  • 输入网页链接,自动生成快照
  • 标签化管理网页链接
1 <script type="text/javascript" src="js/jquery/jquery-1.7.2.min.js"></script>
3 <script type="text/javascript" src="js/dialog.js"></script>
4 <link rel="stylesheet" href="css/blue/dialog.css"/>
5 <script type="text/javascript" src="js/messager.js"></script>
6 <link rel="stylesheet" href="css/blue/messager.css"/>

messager插件是$.messager上面的静态函数,有:alert、confirm和message三个函数

下面函数打开一个默认大小的alert消息框,内容为“请填写执行情况(200字以内)”,级别为警告,按钮文字为“知道了”,1秒后关闭,显示、关闭动画为slide

 1 function openAlert() {
 2     $.messager.alert({
 3         title: '信息',
 4         content: '请填写执行情况(200字以内)',
 5         level: 'warning', // success|info|question|warning|error
 6         btn: '知道了',
 7         time: 1000,
 8         callback: function() {
 9             // location.reload();
10         },
11         showType: 'slide' // slide|fade
12     });

下面函数打开一个默认大小的confirm确认框,内容为您确定删除员工“John”吗,点击确认后打开一个message信息框,这个信息框2秒后关闭

 1 function openConfirm() {
 2     $.messager.confirm({
 3         title: '信息',
 4         content: '您确定删除员工“John”吗?',
 5         btn: [ 
 6                { text: '确定', callback: function() { 
 7                     $.messager.message({
 8                         content: '员工数据删除成功。',
 9                         time: 2000
10                     });
11                } }, 
12                { text: '取消', callback: function() {} }
13         ]
14     });

6、演示和代码

dialog.js  http://5ijy01.duapp.com/jq-ui/js/dialog.js
dialog.css  http://5ijy01.duapp.com/jq-ui/css/blue/dialog.css

messager.js  http://5ijy01.duapp.com/jq-ui/js/messager.js
messager.css  http://5ijy01.duapp.com/jq-ui/css/blue/messager.css

Github  https://github.com/xuguofeng/jq-ui
演示项目  http://5ijy01.duapp.com/jq-ui/index.html