码迷,mamicode.com
首页 > 其他好文 > 详细

EasyUi各种消息框

时间:2016-11-26 20:56:11      阅读:196      评论:0      收藏:0      [点我收藏+]

标签:进度   icon   输出   conf   gre   显示   --   时间   script   

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>  

   <head>        

     <title>EasyUi各种提示框</title>      

     <meta http-equiv="pragma" content="no-cache">  

     <meta http-equiv="cache-control" content="no-cache">  

     <meta http-equiv="expires" content="0">     

     <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">  

     <meta http-equiv="description" content="This is my page">  

     <script type="text/javascript" src="js/jquery-easyui-1.5/jquery.min.js"></script>    

     <link rel="stylesheet" href="js/jquery-easyui-1.5/themes/default/easyui.css" type="text/css"></link>    

     <!-- icon对应的是图片 -->  

      <link rel="stylesheet" href="js/jquery-easyui-1.5/themes/icon.css" type="text/css"></link>    

     <script type="text/javascript" src="js/jquery-easyui-1.5/jquery.easyui.min.js"></script>    

     <script type="text/javascript" src="js/jquery-easyui-1.5/locale/easyui-lang-zh_CN.js"></script>    

     <script type="text/javascript">     

        $(function(){       

            /*        

              title:提示框的标题        

              消息框弹出的内容:确定删除吗?        

              参数b:点击确定返回true,点击取消返回false        

              具体代码实现:        

                   $.messager.confirm("提示框【title】","确定删除吗?",function(b){        

                        if(b){            alert("删除成功!!!");         

                           }else{            alert("删除失败!!!");          

                          }         

                         });                             ************************************************************************************       

          页面加载弹出一个可输入文本的消息框,输出完毕后弹出消息111       

                 title:提示框的标题        消息:提示框里面的内容       

                 val:输出自己在文本框输入的内容      

                  具体代码实现:        

                     $.messager.prompt("title","消息",function(val){         

                         alert(val);        

                      });      

 ************************************************************************************        

         页面加载后弹出一个进度条消息框        

                 具体实现代码:       

                   $.messager.progress({          

                      title: "提示框",    提示框标题         

                       msg: "文件下载中",    提示框内的内容         

                       text: "正在加载...",   进度条内的内容          

                      interval: 300     进度条的速度                 });  

 ************************************************************************************        

        页面加载后弹出一个带图片的消息框       

           这里需要注意的是:         error是一个图片,只提供四片图片选择(question,info,warning,error)       

           $.messager.alert("title","内容","error",function(){               

                alert("111");              

            });             

             */      

         //这个参数为options(配置项,一般已键值对形式出现)      

         $.messager.show({       

           showType: "slide",  //定义消息窗口如何显示(null,slide,fade,show)       

           showSpeed: 3000,     //定义消息窗口显示所需的时间(单位毫秒)        

          width: 100,    //窗口宽度        

          height: 100,   //窗口高度       

           msg: "显示的消息文字", //显示消息文字       

           title: "标题",   //标题     

           timeout: 0    //如果定义为0,除非用户关闭,消息不会自己关闭,定义其他,消息将在超时自动关闭             });     });                   

       </script>  

    </head>  

  <body>     

    <center>       

      <h2>EasyUi实现各种消息框</h2>      

         实现消息框需注意以下几点:       

           1.    <!--          

              <script type="text/javascript" src="js/jquery-easyui-1.5/jquery.min.js"></script> 这行代码必须放在第一行,其他四行顺序随便                               <link rel="stylesheet" href="js/jquery-easyui-1.5/themes/default/easyui.css" type="text/css"></link>         

              <link rel="stylesheet" href="js/jquery-easyui-1.5/themes/icon.css" type="text/css"></link>         

              <script type="text/javascript" src="js/jquery-easyui-1.5/jquery.easyui.min.js"></script>         

              <script type="text/javascript" src="js/jquery-easyui-1.5/locale/easyui-lang-zh_CN.js">        

             -->      

           2.        

             代码必须放在页面加载后       

                <!--        

                   $(function(){          

                    这里写各种消息框代码       

                     }              

                 -->      

    </center>  

  </body>

</html>

EasyUi各种消息框

标签:进度   icon   输出   conf   gre   显示   --   时间   script   

原文地址:http://www.cnblogs.com/WoKeXiaobing/p/6105039.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!