学习EXTJS6(4)基本功能-信息提示框组件
1、使用组件,主要配置表现形式有二种(是否可以说参数)
- 用逗号分隔的传统参数列表方式:
<script type="text/javascript">
Ext.onRead(function(){
Ext.Msg.alert('提示:','逗号分隔参数列表');
});
</script>
- 用json对象的方式(这个思路值得推荐,就是每次要花费过程解析)
<script type="text/javascript">
Ext.onReady(Function(){
var config ={title :'提示:',
msg:'hello usegear,hello json'
}
Ext.Msg.show(config);
});
</script>
ExtJS提供了大量的配置项以满足程序员在实际项目中的各种不同要求
,因此熟悉各种配置项的配置方式以及配置效果是我们快速掌握ExtJS的一个重要捷径。
2、信息提示框组件
Ext.window.MessageBox--是一个工具类,继承Ext.window.Window对象。其实例对象可以通过Ext.MessageBox or Ext.Msg进行访问,其使用效果一样,而后一种调用方式更简短。
- 与Web页面中alert()不同,ExtJS是一个层(div),可以用html格式文本提供显示参数,就是说提示框会栩栩如生丰富多彩的。
- 而标准的alert()是一个标准的弹出窗口,现实的内容是一个纯text文本。
<script typr="text/javascript">
Ext.onReady(function(){
Ext.Msg.alert('提示:','<font coclor=red>支持HTML格式文本</font>');
}); //是否够牛逼,可以增加动态图标噢
</script> - 注意,Ext.MessageBox是异步的,非阻塞的。
3、Ext.MessageBox.alert(String title,String msg,[Function fn],[Object scope])。看demo
<script type="text/javascript">
Ext.onReady(funcion(){
Ext.MessageBox.alert('提示:','请点击我,确定',callBack);
function callBack(id){
alert('回调的结果是'+id);
}//注意:用户确认的代码要放在回调函数中,否则。。。哼哼
});
</script>
4、Ext.MessageBox.confirm(String title,String msg,[Function fn],[Object scope])。同上
5、Ext.MessageBox.prompt(String title,String msg,[Function fn],[Object scope],[Boolean/Number multiline])。
6、Ext.MessageBox.wait() 进度条
7、如果前面的提示框还不过瘾,那么用这个大咖 Ext.MessageBox.show()。参数一大推,慢慢查。
8、Ext.window.MessageBox的其他功能
- 改变默认的按钮文字(很有用)
- 动态更新提示框updateText([String text]) -------NB啊
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<link rel="stylesheet" type="text/css" href="../../study/EXTJS/ext-4.2.1.883/resources/css/ext-all.css" />
<script type="text/javascript" src="../../study/EXTJS/ext-4.2.1.883/bootstrap.js"></script>
<script type="text/javascript" src="../../study/EXTJS/ext-4.2.1.883/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
//~ Ext.MessageBox.msgButtons[0].setText('btn1');//已经改了,查看help
//~ Ext.MessageBox.msgButtons[1].setText('btn2');
//~ Ext.MessageBox.msgButtons[2].setText('btn3');
//~ Ext.MessageBox.msgButtons[3].setText('btn4');
Ext.MessageBox.buttonText.yes = "Hello";//已经改成这样了
Ext.MessageBox.show({ title : '提示:',msg : '自定义按钮文字',modal:true,buttons : Ext.Msg.YESNOCANCEL});
});
</script>
</head>
<body>
<div id='ProgressBar'></div>
</body>
</html>
学习EXTJS6(4)基本功能-信息提示框组件的更多相关文章
- 强大的响应式jQuery消息通知框和信息提示框插件
lobibox是一款功能很强大的jQuery消息通知框和信息提示框插件.这个插件分为两个部分:消息通知框和信息提示框.它能很好的结合Bootstrap使用. 信息提示框 lobibox的信息提示框能够 ...
- Flutter学习笔记(21)--TextField文本框组件和Card卡片组件
如需转载,请注明出处:Flutter学习笔记(21)--TextField文本框组件和Card卡片组件 今天来学习下TextField文本框组件和Card卡片组件. 只要是应用程序就少不了交互,基本上 ...
- 第一百九十六节,jQuery EasyUI,Tooltip(提示框)组件
jQuery EasyUI,Tooltip(提示框)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 Tooltip(提示框)组件的使用方法, ...
- tooltip提示框组件
Tooltip 提示框组件 可独立于其他组件通过$.fn.tooltip.defaults重写默认的defaults.当用户移动鼠标指针在某个元素上时,出现提示信息窗口来显示额外信息.提示内容可以包含 ...
- ASP.NET div信息提示框显示几秒后隐藏
今天在旧系统中,用户要求,要把一个javascript alert的信息提示,改为Div tag来显示,它在显示时,仅显示几秒,然后隐藏,这样无需用户去点击alert信息框的确定或是关闭铵钮. 下面I ...
- qt5信息提示框QMessageBox用法
information QMessageBox::information(NULL, "Title", "Content", QMessageBox::Yes ...
- qt5信息提示框QMessageBox用法(很全)
information QMessageBox::information(NULL, "Title", "Content", QMessageBox::Yes ...
- Qt 信息提示框 QMessageBox
information QMessageBox::information(NULL, "Title","Content",QMessageBox::Yes | ...
- Android学习笔记通过Toast显示消息提示框
显示消息提示框的步骤 这个很简单我就直接上代码了: Button show = (Button)findViewById(R.id.show); show.setOnClickListener(new ...
随机推荐
- 初触Python,关于pyquery解析html(百度贴吧)
一直听同事说Python是个奇妙的语言,上周在逛知乎的时候深受这个话题的启示. 能利用爬虫技术做到哪些非常酷非常有趣非常实用的事情? 先是说到IDE的选择,作为python新人,尽管知道mac终端自带 ...
- spring拦截器和注解处理日志操作
整体思想:通过拦截器拦截所有的请求,处理含有自定义注解的方法,通过request得到需要的参数. 拦截器代码: package com.zktx.platform.log2; import java. ...
- hdoj--5612--Baby Ming and Matrix games(dfs)
Baby Ming and Matrix games Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K ...
- bzoj 1556 墓地秘密 —— 状压DP
题目:https://www.lydsy.com/JudgeOnline/problem.php?id=1556 预处理出两个障碍四个方向之间的距离(转弯次数),就可以状压DP了: 但预处理很麻烦.. ...
- android有用代码片段
一. 获取系统版本号: [java] view plaincopy PackageInfo info = this.getPackageManager().getPackageInfo(this.g ...
- @RequestBody接收的是一个json对象
一直以为在SpringMVC环境中,@RequestBody接收的是一个json对象,调试代码时没有成功,后来才发现,其实 @RequestBody接收的是一个json字符串,而不是一个json对象. ...
- Vue页面间传值,以及客户端数据存储
初学Vue,遇到了页面传值的问题,大概网上学习了解了一下,在此跟大家分享一下学习心得,欢迎批评指正. 一.参数传值 如果是简单的页面传值,比如传一个id到详情页等等,推荐使用参数传值. 这里页面是通过 ...
- Laravel5.1学习笔记10 系统架构2 应用程序结构
应用程序结构 简介 根目录 App 目录 为应用程序设置命名空间 简介 默认的 Laravel 应用程序结构是为了给无论构建大型还是小型应用程序都提供一个良好的开始.当然,你可以依照喜好自由地组织应用 ...
- RecyclerView的基础用法
为了让RecyclerView可以在所有的Android版本中都能使用,Android开发团队将RecyclerView定义在support.v7包当中.在使用该控件时需要打开当前Modile的bui ...
- Eclipse安装配置——For Java
1.下载安装JRE 2.下载Eclipse,解压到相应文件夹 3.配置Eclipse 3.1 配置字体大小 -12号 3.2配置workspace默认编码,utf-8,默认系统windows 3.3 ...