1.创建一个Extjs的Window,用ajax请求HTML文件,并执行HTML的代码和脚本
窗体中文字是从一个HTML中获取,并且HTML中执行脚本使窗体高亮1秒
主页面:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="../../extjslib/resources/css/ext-all.css" > extjs样式
<script type="text/javascript" src="../../extjslib/adapter/ext/ext-base-debug.js"></script> extjs基础库
<script type="text/javascript" src="../../extjslib/ext-all-debug-w-comments.js"></script> extjs组件库
<script type="text/javascript">
Ext.BLANK_IMAGE_URL = "../../extjslib/resources/images/default/s.gif"; //占位图片,应在应用代码执行前指定
</script>
<script type="text/javascript" src="autoload.js"></script>
</head>
</html>
这个里注意js加载顺序,要是基础要先加载,别写反了,造成js报错,对于想一窥究竟的人,每个js库都有对应的debug脚步
autoload.js
function buildWindow(){
var win = new Ext.Window({//创建一个窗口实例
id:‘myWindow‘,//实例id,通过Ext.getCmp方法可以查询
title:‘Window Demo AutoLoad‘,
width:300,
height:150,
layout:‘fit‘,//布局为使窗体内容填满窗口
autoLoad:{//自动加载
url:‘sayHi.html‘,//加载页面url,这里只会显示html片段
scripts:true//执行加载页面脚本,但是执行块和行级脚本
}
});
win.show();//显示窗口
}
Ext.onReady(buildWindow);//onReady方法是在DOM就绪后加载图片之前执行
sayHi.html
<div>Hello from the <b> world</b> of Ajax</div>
<script type="text/javascript">
function highlightWindow(){
var win = Ext.getCmp(‘myWindow‘);//获取窗口实例
var winBody = win.body;//
winBody.highlight();
}
highlightWindow.defer(1000);//1秒以后执行
</script>
这里的亮点在于defer,它比setTimeout方便原因在于
1.更简单,任何一个function都可以这样做,只要传一个时间
2.可以对被延迟执行的方法和执行的作用域进行控制,并传入制定参数(原话,还不太理解)
时间： 2024-12-22 21:40:43