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 相关文章推荐
Javascript 判断函数类型完美解决方案
Sep 02 Javascript
js 数组的for循环到底应该怎么写?
May 31 Javascript
$.get获取一个文件的内容示例代码
Sep 11 Javascript
table对象中的insertRow与deleteRow使用示例
Jan 26 Javascript
javascript操作referer详细解析
Mar 10 Javascript
JS实现仿微博可关闭弹出层效果
Sep 21 Javascript
基于jQuery实现的仿百度首页滑动选项卡效果代码
Nov 16 Javascript
jstl中判断list中是否包含某个值的简单方法
Oct 14 Javascript
vue页面使用阿里oss上传功能的实例(二)
Aug 09 Javascript
一文让你彻底搞清楚javascript中的require、import与export
Sep 24 Javascript
深入理解Node module模块
Mar 26 Javascript
JavaScript实现的简单加密解密操作示例
Jun 01 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
制作美丽的拉花
2021/03/03 冲泡冲煮
使用PHP的日期与时间函数技巧
2008/04/24 PHP
邮箱正则表达式实现代码(针对php)
2013/06/21 PHP
PHP使用CURL_MULTI实现多线程采集的例子
2014/07/29 PHP
分享最受欢迎的5款PHP框架
2014/11/27 PHP
php上传图片客户端和服务器端实现方法
2015/03/30 PHP
yii实现使用CUploadedFile上传文件的方法
2015/12/28 PHP
php 使用curl模拟登录人人(校内)网的简单实例
2016/06/06 PHP
php+redis在实际项目中HTTP 500: Internal Server Error故障排除
2017/02/05 PHP
解析jquery中的ajax缓存问题
2013/12/19 Javascript
检查输入的是否是数字使用keyCode配合onkeypress事件
2014/01/23 Javascript
分析了一下JQuery中的extend方法实现原理
2015/02/27 Javascript
js上传图片及预览功能实例分析
2015/04/24 Javascript
浅谈Javascript数据属性与访问器属性
2016/07/26 Javascript
jquery仿京东侧边栏导航效果
2017/03/02 Javascript
微信小程序之页面拦截器的示例代码
2017/09/07 Javascript
angularjs 页面自适应高度的方法
2018/01/17 Javascript
mint-ui在vue中的使用示例
2018/04/05 Javascript
vue通过指令(directives)实现点击空白处收起下拉框
2018/12/06 Javascript
node.js连接mysql与基本用法示例
2019/01/05 Javascript
使用Vue调取接口,并渲染数据的示例代码
2019/10/28 Javascript
nodejs脚本centos开机启动实操方法
2020/03/04 NodeJs
Python通过OpenCV的findContours获取轮廓并切割实例
2018/01/05 Python
python使用xslt提取网页数据的方法
2018/02/23 Python
在python中将字符串转为json对象并取值的方法
2018/12/31 Python
TensorFlow 读取CSV数据的实例
2020/02/05 Python
让IE支持CSS3的不完全兼容方案
2014/09/19 HTML / CSS
美国高档帽子网上商店:Hats.com
2018/08/09 全球购物
高效课堂标语
2014/06/26 职场文书
党员个人整改方案及措施
2014/10/25 职场文书
中秋节慰问信
2015/02/15 职场文书
创业计划书之校园跑腿公司
2019/09/24 职场文书
Java图书管理系统,课程设计必用(源码+文档)
2021/06/30 Java/Android
css3应用示例:新增的选择器
2022/03/16 HTML / CSS
vue项目proxyTable配置和部署服务器
2022/04/14 Vue.js
Oracle锁表解决方法的详细记录
2022/06/05 Oracle