easyUI之Messager（消息窗口）

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>Messager（消息窗口）</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
      <link rel="stylesheet" href="../themes/default/easyui.css" type="text/css"></link>
    <link rel="stylesheet" href="../themes/icon.css" type="text/css"></link>
    <script type="text/javascript" src="../js/jquery.min.js"></script>
    <script type="text/javascript" src="../js/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="../js/easyui-lang-zh_CN.js"></script>
  </head>
  <body>
    
    
    <input type="button" value="警告框"/><br/>
    <input type="button" value="确认框"/><br/>
    <input type="button" value="输入框"/><br/>
    <input type="button" value="显示框"/><br/>
    
    
    <div style="margin:100px"></div>
    <script type="text/javascript">
        //定位所有的button按钮，同时提供单击事件
        $(":button").click(function(){
            //获取value属性值
            var tip = $(this).val();
            //去空格
            tip = $.trim(tip);
            //如果警告框的话
            if("警告框" == tip){
                $.messager.alert("警告框","继续努力","warning",function(){
                    alert("关闭");
                });
            }else if("确认框" == tip){
                $.messager.confirm("确认框","你确认要关闭该确认框吗?",function(value){
                    alert(value);
                });    
            }else if("输入框" == tip){
                $.messager.prompt("输入框","你期希的月薪是多少?",function(sal){
                    
                    if(sal == undefined){
                        alert("请输入月薪");
                    }else{
                        if(sal<6000){
                            alert("你的谦虚了");
                        }else if(sal < 7000){
                            alert("你加点油了");
                        }else{
                            alert("你很不错了");
                        }
                    }
                    
                });
            }else if("显示框" == tip){
                $.messager.show({
                    showType : "slide",
                    showSpeed : 500,
                    width : 300,
                    height : 300,
                    title : "显示框",
                    msg : "这是内容",
                    timeout : 5000
                });
            }
        });    
    </script>
    
    
    
  </body>
</html>
easyUI之Messager（消息窗口）

猜你喜欢
