前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >EXT窗口

EXT窗口

作者头像
Java架构师必看
发布2021-03-22 11:22:05
1.5K0
发布2021-03-22 11:22:05
举报
文章被收录于专栏:Java架构师必看

Alert提示框

Ext的对话框都封装在Ext.MessageBox类,该类还有一个简写形式即Ext.Msg,可以直接通过Ext.MessageBox或Ext.Msg来直接调用相应的对话框方法来显示Ext对话框。

代码语言:javascript
复制
<html>
<head><title>演示</title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<link rel="stylesheet" type="text/css" media="all" href="extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="extjs/ext-all.js"></script>
<script type="text/javascript" language="javascript">
Ext.onReady(function(){
Ext.get("btnAlert").on("click",function(){
Ext.MessageBox.alert("请注意","这是ExtJS的提示框");
});
});
</script>
</head>
<body>
<div id="hello"></div>
<input id="btnAlert" type="button" value="alert框" />
</body>
</html>

confirm

除了alert以外,Ext还包含confirm、prompt、progress、wait等对话框,另外我们可以根据需要显示自下定义的对 话框。普通对话框一般包括四个参数,比如confirm的方法签名为confirm ( String title, String msg, [Function fn], [Object scope] ) ,参数title表示对话框的标题,参数msg表示对话框中的提示信息,这两个参数是必须的;可选的参数fn表示当关闭对话框后执行的回调函数,参数 scope表示回调函数的执行作用域。回调函数可以包含两个参数,即button与text,button表示点击的按钮,text表示对话框中有活动输 入选项时输入的文本内容。我们可以在回调函数中通过button参数来判断用户作了什么什么选择,可以通过text来读取在对话框中输入的内容

代码语言:javascript
复制
<html>
<head><title>演示</title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<link rel="stylesheet" type="text/css" media="all" href="extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="extjs/ext-all.js"></script>
 <script src="extjs/build/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript" language="javascript">
Ext.onReady(function(){
    Ext.get("btn").on("click",function(){
        Ext.MessageBox.confirm("请确认","是否真的要删除指定的内容",function(button,text){
            alert(button);
            //alert(text);
        });
    });
    });

</script>
</head>
<body>
<div id="hello"></div>
<input id="btn" type="button" value="alert框" />
</body>
</html>

更实用的

代码语言:javascript
复制
<html>
<head><title>演示</title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<link rel="stylesheet" type="text/css" media="all" href="extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="extjs/ext-all.js"></script>
 <script src="extjs/build/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript" language="javascript">
Ext.onReady(function(){
    Ext.get("btn").on("click",function(){
        Ext.MessageBox.confirm("请确认","是否真的要删除指定的内容",function(button,text)
        {
            if(button=="yes"){
                //执行删除操作
                alert("成功删除");
               }
                });
                });
});
</script>
</head>
<body>
<div id="hello"></div>
<input id="btn" type="button" value="alert框" />
</body>
</html>

 prompt框

用的不多,不过有时候会用到

代码语言:javascript
复制
<html>
<head><title>演示</title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<link rel="stylesheet" type="text/css" media="all" href="extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="extjs/ext-all.js"></script>
 <script src="extjs/build/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript" language="javascript">
Ext.onReady(function(){
Ext.get("btn").on("click",function(){
Ext.MessageBox.prompt("输入提示框","请输入数字:",function(button,text){
if(button=="ok"){
alert("你输入的数字是:"+text);
}
else alert("你没有输入!");
});
});
});


</script>
</head>
<body>
<div id="hello"></div>
<input id="btn" type="button" value="alert框" />
</body>
</html>

本文由来源 21aspnet,由 javajgs_com 整理编辑,其版权均为 21aspnet 所有,文章内容系作者个人观点,不代表 Java架构师必看 对观点赞同或支持。如需转载,请注明文章来源。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档