learning ext js 中文版
在对话框中添加图标和按钮事件。这只需要在css和config里做些修改即可。
首先准备一张milton-head-icon.png的图标图片,与html放在同一目录。
在html的head里添加style:
.milton-icon {
background: url(milton-head-icon.png) no-repeat;
}
然后我们需要在窗口配置里做些更改。图标要用到我们在css里添加的style值:milton-icon。我们还要添加一个函数,当用户点击对话框中的任一按钮时执行。这个函数定义成匿名函数,仅仅用来传递参数,如下:Ext.Msg.show({
title: 'Milton',
msg: 'Have you seen my stapler?',
buttons: {
yes: true,
no: true,
cancel: true
},
icon: 'milton-icon',
fn: function(btn) {
Ext.Msg.alert('You Clicked', btn);
}
});
这个例子中的函数只有一个参数,传递的是被点击的按钮的名称。如果用户点击了Yes按钮,btn参数就传递了yes值。提醒:
对话框中右上角的的关闭按钮和键盘上的esc都是和cancel按钮绑定的,这些类似桌面应用的小功能extjs已经帮我们做好了。
完整原代码:
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
.milton-icon {
background: url(milton-head-icon.png) no-repeat;
}
</style>
<title>extjs examples</title>
<link rel="stylesheet" type="text/css"
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" src="extjs/build/locale/ext-lang-zh_CN.js"></script>
<script>
Ext.onReady(function(){
Ext.Msg.show({
title: 'Milton',
msg: 'Have you seen my stapler?',
buttons: {
yes: true,
no: true,
cancel: true
},
icon: 'milton-icon',
fn: function(btn) {
Ext.Msg.alert('You Clicked', btn);
}
});
});
</script>
</head>
<body>
<!--copyright guoyiqi-->
</body>
</html>
分享到:
相关推荐
你也可以根据需求监听其他事件,如窗口关闭事件,或者在对话框中使用表单时,监听表单的提交事件。 ```javascript dialog.on('close', function() { // 在这里处理对话框被关闭的逻辑,例如清理资源或更新状态 });...
通过阅读《Learning Ext JS 3.2》,读者不仅可以学习到Ext JS 3.2的具体用法,还能理解其设计哲学和开发模式,提升在Web应用开发领域的专业技能。同时,对于那些想要进一步升级到更高版本的开发者,这本书也能提供一...
在文档的描述中提到:“Learning_Ext_JS.pdf使用中文文档. 希望能帮助到大家。”这表明该书的目的在于为读者提供一个详尽的学习指南,以帮助他们更好地理解和掌握Ext JS框架。此文档对于那些想要深入学习并应用Ext ...
为了帮助开发人员更快地掌握这一框架,有一些书籍和在线资源提供了教程和实例代码,比如《Learning Ext JS 3.2》,该书由Shea Frederick、Colin Ramsay、Steve 'Cutter' Blades和Nigel White联合编写,旨在引导初学...
Learning Ext JS 4 by Crysfel Villa and Armando Gonzalez (Oct 8, 2012) $49.99 Paperback Order in the next 13 hours and get it by Tuesday, Mar 19. More Buying Choices - Paperback $46.48 new (17 ...
在学习Ext JS时,重要的是要了解其组件模型、数据管理、事件处理以及与后端服务的交互方式。 其次,描述部分提到这是一本由外国专家编写的教程,并且是网友分享的PDF格式电子书。这说明了该资源的来源和获取方式。...
NULL 博文链接:https://guoyiqi.iteye.com/blog/322673
learning ext js learning ext jslearning ext js learning ext js
本书《Learning Ext JS》由Shea Frederick、Colin Ramsay 和 Steve 'Cutter' Blades 共同编写,旨在为读者提供一个系统性的学习指南,帮助开发者掌握使用Ext JS开发RIA(Rich Internet Application)的技术。...
Ext JS是一个用于创建交互式用户界面的JavaScript库,它提供了丰富的组件和工具,使得开发者能够轻松地开发出高性能的Web应用。 ### 构建动态用户界面 在现代Web开发中,用户界面的体验对于吸引和保留用户至关重要...
《Learning Ext JS》涵盖了Ext JS的核心概念和技术细节,旨在通过实践案例教会读者如何高效地使用该框架。以下是书中涉及的一些关键知识点: 1. **Ext JS基础**:介绍了Ext JS的历史背景、版本变迁以及为何选择Ext ...
Ext JS是一种基于JavaScript的库,用于构建交互式和高性能的Web应用程序。它提供了一系列丰富的UI组件,如表格、网格、树、图表等,以及强大的数据管理功能,使得开发者能够快速地创建复杂的用户界面。Ext JS支持...
通过 "Learning TypeScript 中文完整版.pdf" 这本书,读者将全面了解 TypeScript 的各种特性,并学会如何在实际项目中有效地应用它们,提升开发效率和代码质量。无论是初学者还是经验丰富的开发者,都能从中受益匪浅...
在《学习Ext.JS 3.2》一书中,作者们(Shea Frederick、Colin Ramsay、Steve 'Cutter' Blades 和 Nigel White)深入探讨了如何利用Ext.JS 3.2版本来构建与传统桌面应用程序相似的用户界面。这包括如何设计和实现复杂...
《Learning ExtJS, Fourth Edition (Ext JS 5+)》是关于Ext JS框架的一本经典教程,该书针对Ext JS的5.x版本进行了全面升级。Ext JS是一个成熟的JavaScript框架,用于开发具有丰富交互性的Web应用程序。它最初由Jack...
《Learning Python中文版》的原作者Mark Lutz和David Ascher都具备丰富的Python编程经验和教学经验,他们在书中融入了大量的实例、练习和答案,使自学成为可能。其中,Mark Lutz是一位资深的软件设计师和Python专家...
书中强调了实践操作的重要性,使读者能够在实践中学习并掌握Ext JS的核心概念和技术。 #### 三、适合人群 - **进阶开发人员**:由于本书中的案例较为复杂且深入,因此更适合那些已经熟悉JavaScript基本语法并且对...
强化学习是人工智能领域的一个重要分支,它通过与环境的交互,让智能体在一系列的决策过程中不断学习,以达到最大化期望的奖励。《强化学习导论》是这方面的经典教材,由Richard S. Sutton和Andrew G. Barto共同撰写...
An Introduction to Statistical Learning (英文版和中文版),统计学习导论 基于R应用,学习机器学习入门的经典书籍,包括中文版和英文版