Extjs学习过程中新手容易碰到的低级错误积累


Posted in Javascript onFebruary 11, 2010

1.下载extjs的安装包,里面没有.msi文件,看好多的安装方法说都有这个.msi文件,但是我在官方下载的解压缩后没有,以为不能用。说明一下,我用的开发工具是visualstudio 2008,其实根本不用安装,直接解压缩后放到创建的网站项目的目录下,然后再也页面添加extjs的引用就行啦。

2.extjs的引用的错误。
<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>

<script type="text/javascript" src="extjs/ext-all.js"></script>

<link rel="Stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" />
注意这里的顺序,一定要把ext-base放在ext-all的前面,否则虽然不报错误,但是你的页面预期的效果是不会有的。

3. <script type="text/javascript" src="extjs/adapter/ext/ext-base.js"/>
这样的错误也是我学习过程中经历的。

4.menu菜单的使用过程中的错误。Menu菜单的demo中,出现页面没有报错,但是已有一条蓝线,页面什么也没有。后来才发现,原来是render函数的问题,源码:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="9-1.aspx.cs" Inherits="_9_1" %> 
<!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 runat="server"> 
<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script> 
<script type="text/javascript" src="extjs/ext-all.js"></script> 
<link rel="Stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" /> 
<title> 工具栏菜单demo</title> 
<script type="text/javascript"> 
Ext.onReady(function(){ 
var menu2=new Ext.menu.Menu({ 
items:[ 
{text:"今天"}, 
{text:"昨天"}, 
{text:"一周"}, 
{text:"一月"} 
] 
}); 
var menu1 = new Ext.menu.Menu({ 
items:[ 
{text:"新建"}, 
{text:"打开"}, 
{text:"保存"}, 
{text:"另存"}, 
"-", 
{text:"历史",menu:menu2}, 
"-", 
{text:"关闭"} 
] 
}); 
var tb = new Ext.Toolbar(); 
tb.render("hello"); 
tb.add({ 
text:"文件", 
menu:menu1 
} 
); 
tb.add({ 
text:"时间", 
menu:menu2}); 
}); 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div id="hello"> 
</div> 
</form> 
</body> 
</html>

更改源码中tb.render函数的位置为</script>前面。这样预期的级联菜单效果就出来啦。

这是我在extjs学习中犯的一些低级错误,希望能够对和我一样刚开始接触extjs的有点启发。

Javascript 相关文章推荐
JCrop+ajaxUpload 图像切割上传的实例代码
Jul 20 Javascript
Bootstrap Validator 表单验证
Jul 25 Javascript
利用JS提交表单的几种方法和验证(必看篇)
Sep 17 Javascript
js制作支付倒计时页面
Oct 21 Javascript
Bootstrap框架实现广告轮播效果
Nov 28 Javascript
JS仿京东移动端手指拨动切换轮播图效果
Apr 10 Javascript
jQuery实现滚动条滚动到子元素位置(方便定位)
Jan 08 Javascript
浅谈vue项目重构技术要点和总结
Jan 23 Javascript
浅谈Vuex注入Vue生命周期的过程
May 20 Javascript
vue中如何实现后台管理系统的权限控制的方法步骤
Sep 05 Javascript
修改Vue打包后的默认文件名操作
Aug 12 Javascript
JavaScript 判断数据类型的4种方法
Sep 11 Javascript
我遇到的参数传递中 双引号单引号嵌套问题
Feb 11 #Javascript
一段实现页面上的图片延时加载的js代码
Feb 11 #Javascript
JavaScript Event学习第十一章 按键的检测
Feb 10 #Javascript
JavaScript Event学习第十章 一些可替换的事件对
Feb 10 #Javascript
jQuery插件 tabBox实现代码
Feb 09 #Javascript
基于Jquery的简单&amp;简陋Tabs插件代码
Feb 09 #Javascript
JQUERY操作JSON实例代码
Feb 09 #Javascript
You might like
php 全文搜索和替换的实现代码
2008/07/29 PHP
上传文件先创建目录 再上传到目录里面去
2010/12/29 PHP
php 错误处理经验分享
2011/10/11 PHP
Yii2简单实现给表单添加验证码的方法
2016/07/18 PHP
详解PHP如何更好的利用PHPstorm的自动提示
2017/08/18 PHP
php中html_entity_decode实现HTML实体转义
2018/06/13 PHP
javascript之大字符串的连接的StringBuffer 类
2007/05/08 Javascript
初学JavaScript第二章
2008/09/30 Javascript
ajax页面无刷新 IE下遭遇Ajax缓存导致数据不更新的问题
2012/12/11 Javascript
分享一则javascript 调试技巧
2015/01/02 Javascript
SWFUpload多文件上传及文件个数限制的方法
2016/05/31 Javascript
JavaScript中的ajax功能的概念和示例详解
2016/10/17 Javascript
pc加载更多功能和移动端下拉刷新加载数据
2016/11/07 Javascript
jquery表单插件form使用方法详解
2017/01/20 Javascript
图片上传之FileAPI与NodeJs
2017/01/24 NodeJs
AngularJS constant和value区别详解
2017/02/28 Javascript
jQuery实现浏览器之间跳转并传递参数功能【支持中文字符】
2018/03/28 jQuery
原生javascript AJAX 三级联动的实现代码
2018/05/04 Javascript
[04:03]DOTA2肉山黑名单梦之声 风暴之灵中文配音鉴赏
2013/07/03 DOTA
Python代码实现KNN算法
2017/12/20 Python
Python smtplib实现发送邮件功能
2018/05/22 Python
Django的性能优化实现解析
2019/07/30 Python
python实现单链表的方法示例
2019/09/03 Python
pyecharts调整图例与各板块的位置间距实例
2020/05/16 Python
python实现磁盘日志清理的示例
2020/11/05 Python
只要五步 就可以用HTML5/CSS3快速制作便签贴特效(图)
2012/06/04 HTML / CSS
美国高端寝具品牌:Coyuchi
2017/02/08 全球购物
模范教师事迹材料
2014/02/10 职场文书
个人租房协议书
2014/04/09 职场文书
2014公司党员自我评价范文
2014/09/11 职场文书
500字小学生检讨书
2015/02/19 职场文书
单独二胎证明
2015/06/24 职场文书
Oracle 死锁的检测查询及处理
2021/09/25 Oracle
关于Spring配置文件加载方式变化引发的异常详解
2022/01/18 Java/Android
nginx 添加http_stub_status_module模块
2022/05/25 Servers
react中useState使用:如何实现在当前表格直接更改数据
2022/08/05 Javascript