Ext常用函数

最新推荐文章于 2021-05-19 13:15:34 发布

iteye_9439

最新推荐文章于 2021-05-19 13:15:34 发布

阅读量670

点赞数

分类专栏： ExtJs 文章标签： Ext.onReady()

本文链接：https://blog.csdn.net/iteye_9439/article/details/82517630

版权

ExtJs 专栏收录该内容

31 篇文章 0 订阅

订阅专栏

函数一：Ext.onReady（）
[color=red]Ext的Dom都是动态生成的，而onReady的调用是发生在所有的Document对象都加载完毕的时候
，所以为了保障请求是安全的，应该保持所有的处理都在onReady中进行！[/color]

Ext.onReady(Function fn,Object scope,boolean override)

参数说明：
fn: 执行的函数
Object scope ：fn 执行的范围，为可选参数。
boolean override：表示是否以scope作为fn的默认执行范围，为可选参数。
返回值：无

示例：
<script type="text/javascript">
Ext.onReady(function(){
Ext.Msg.alert('提示','内容加载完毕，onReady后的调用');
});
</script>

--------------------------------------------------------------------------------
函数二：模式表选择器
Ext.select（）
基于CSS来获取应用了该样式表的对象，即样式表的选择器。

调用格式：
[color=red]Ext.select(String/Array selector,[Boolean unique],[HTMLElement/String root])[/color]
selector:字符串集
unique：为true，表示取得唯一的一个Element
root：选择器查询时的根节点。为空时则指定从document开始进行查询。

Boolean unique,HTMLElement/String root 为可选参数

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>示例</title>
<link rel="stylesheet" type="text/css" href="ext-4.2.1/resources/css/ext-all.css" />
<script type="text/javascript" src="ext-4.2.1/bootstrap.js"></script>
<script type="text/javascript" src="ext-4.2.1/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
//创建一个panel
var panel= new Ext.Panel({
title:'示例',
renderTo:'sub1',
width:'300px',
html:"<div id='div1' style='height:200px'> 我的id是sub3</div>"
});
//通过选择器选择一个唯一的id为div1的Element节点
var el=Ext.select(["div1"],true,"fat1");
el.on("click",function test(){
Ext.Msg.alert("提示","您点击了id为div1的节点");
});

});
</script>
</head>

<body>
<div id="sub1"></div>
</body>
</html>
---------------------------------------------------------------------------
函数三：查询选择器 Ext.query（）

调用格式[color=red]Ext.query(String path,[Node root]);[/color]
path：选择器查询时的节点path
root：选择器查询时的根节点。为空时则指定从document开始进行查询
返回值：Array 符合条件的节点的数组

查询选择器的使用：

<script type="text/javascript">
Ext.onReady(function(){
//创建一个panel
var panel= new Ext.Panel({
title:'示例',
renderTo:'sub1',
width:'300px',
html:"<div id='div1' style='height:200px'> 我的id是sub3</div>"
});
//选择元素为Div其id为Div1的节点数组
[color=red] var el=Ext.query("#div1");[/color]

if(el.length>0){
Ext.Msg.alert("提示","取得了"+el.length);
}

});
</script>
---------------------------------------------------------------------------------
函数四：Ext.getCmp( )
[color=red]Ext.getCmp(String id);[/color]
id:指定组件的id.
返回Ext.Component管理的指定id的component对象,实际是Ext.ComponentMgr.get(id)的包装调用。

<script type="text/javascript">
Ext.onReady(function(){
//创建一个panel
var panel= new Ext.Panel({
title:'示例',
id:'panel1',
renderTo:'sub1',
width:'300px',
html:"<div id='div1' style='height:200px'> 我的id是sub3</div>"
});
var el=Ext.getCmp("panel1");
Ext.Msg.alert("提示","类型为"+el.getXType());

});
</script>
--------------------------------------------------------------
函数五：
[color=red]Ext.apply(Object obj, Object config, Object defaults ) [/color]
obj: 目标拷贝对象
config:源拷贝对象
defaults:默认属性值
返回值：obj ，即拷贝完成的对象

为指定对象拷贝属性，或以默认的属性初始化一个对象。
在调用时表示将第2个参数config所有的属性拷贝到第1个参数obj对象的属性中，如果config为空，将第3个参数defaults的属性
拷贝到obj 的属性中。
---------------------------------------------------------------------------------
函数六：
[color=red]Ext.encode( Object obj, Object config, Object defaults )[/color]
将定义的JSON对象进行解析，解析成字符串，是一标准的Ext.JSON.encode.在调用时表示将参数Object进行解析，返回字符串。
obj: 目标拷贝对象
返回值：string ,即将Object进行解析的字符串。

<script type="text/javascript">
Ext.onReady(function(){
var person={name:'Tom',age:24}; //定义一个JSON对象
var panel=new Ext.Panel({
title:'encode',
frame:true,
renderTo:'sub1',
width:'300px',
html:"<div id='div1' style='height:200px'>将对象进行转换成字符串</div>"
});
var el=Ext.select(["div1"],true);
el.on("click",function tes(){
[color=red] Ext.Msg.alert('提示',Ext.encode(person));//打印将对象转变成字符串[/color]
});

});
</script>

iteye_9439

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Ext常用函数

函数一：Ext.onReady（）[color=red]Ext的Dom都是动态生成的，而onReady的调用是发生在所有的Document对象都加载完毕的时候，所以为了保障请求是安全的，应该保持所有的处理都在onReady中进行！[/color]Ext.onReady(Function fn,Object scope,boolean override)参数说明：fn: ...
复制链接

扫一扫