2010.04.14(2)———Ext 之tab_TabPanel2

2010.04.14(2)———Ext 之tab_TabPanel2

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>TabPanel2</title>
    <link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css">
    <!-- ext-base.js必须在ext-all前面,不然,Ext无法识别 -->
    <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">
Ext.onReady(function(){
	var tab2 = new Ext.TabPanel({
		renderTo: document.body,
		activeTo: 0,
		width: 450,
		height: 300,
		items: [
			{
				title: "普通标签",
				html: "下面有美女啊"
			},
			{
				title: "ajax标签-字符串",
				autoLoad: "ajax1.jsp"
				/*
				实时刷新
				按照Updater类中Ext.Updater.update 方法指定的类型来定义,
				可以为一个字符串,或者一个对象
				*/
			},
			{
				title: "ajax标签-对象",
				autoLoad: {url: "ajax2.jsp",params: "name=xiaodu&age=18"}
			},
			{
				title: "时间标签",
				listeners: {activate: fn},
				//注册一个时间监听,activate:当Panel在视觉上被激活之后触发
				html: "再往下看,就有美女了"
			},
			{
				title: "不可用标签",
				disabled: true,//只读状态
				html: "美女在这里,你能看见吗"
			}
		]
	});
	function fn(tab){
		Ext.Msg.alert("呵呵",tab.title+"被点了");
	}
});


</script>
</head>
  
<body>

</body>
</html>












你可能感兴趣的:(html,Ajax,jsp,ext)