当前位置: 首页 > 图文教程 > 网络编程 > Javascript > JS之小练习代码

Javascript
js 创建一个浮动div的代码
javascript下利用数组缓存正则表达式的实现方法
javascript 最常用的10个自定义函数[推荐]
jQuery 常见开发使用技巧总结
十分钟打造AutoComplete自动完成效果代码
JavaScript 入门基础知识 想学习js的朋友可以参考下
javascript 清空form表单中某种元素的值
javascript 格式化时间日期函数代码脚本之家修正版
javascript dom操作之cloneNode文本节点克隆使用技巧
jQuery 动态酷效果实现总结
jQuery中的常用事件总结
用Jquery实现可编辑表格并用AJAX提交到服务器修改数据
javascript+css 网页每次加载不同样式的实现方法
向大师们学习Javascript(视频与PPT)
js 实现无干扰阴影效果 简单好用(附文件下载)
JavaScript 拾漏补遗
IE6 弹出Iframe层中的文本框“经常”无法获得输入焦点
jQuery的强大选择器小结
jquery $(document).ready() 与window.onload的区别
javascript 动态调整图片尺寸实现代码

Javascript 中的 JS之小练习代码


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-12   浏览: 171 ::
收藏到网摘: n/a

初学者不建议看,这些都是用类实现的代码,高手推荐学习 没有html代码,只有JS代码,小练习内容如下:(从陈治文老师的课程中学到)
<script>
Ext.onReady(function(){
// Ext.Msg.alert("系统提示(thtwinj2ee)","环境配置正确!") ;
var myPosition = Ext.data.Record.create(
[{name:"position"}]
) ;//返回一个function
new Ext.Window({
title:"测试用窗口(绝不裸奔)",
width:550,
height:370,
labelWidth:70,
plain:true ,
layout:"form",
defaults:{anchor:"95%"},
// buttonAlign:"center",
items:
[
{
layout:"column",
baseCls:"x-plain",
style:"padding:8px",
items:
[
{
columnWidth:.5,
layout:"form",
baseCls:"x-plain",
labelWidth:70,
defaults:{width:150},
defaultType:"textfield",
items:
[
{
fieldLabel:"姓名"
},
{
fieldLabel:"年龄",
value:23,
readOnly:true
},
{
xtype:"datefield",
format:"Y-m-d",
value:"1986-11-16",
readOnly:true,
fieldLabel:"出生日期",
listeners:
{
"blur":function(_df)
{
var _age = _df.ownerCt.findByType("textfield")[1] ;
_age.setValue(new Date().getFullYear() - _df.getValue().getFullYear() + 1) ;
}
}
},
{
fieldLabel:"联系电话"
},
{
fieldLabel:"手机号码"
},
{
fieldLabel:"电子邮件"
},
{
xtype:"combo",
fieldLabel:"性别",
readOnly:true,
displayField:"sex",
value:"男",
triggerAction:"all",
mode:"local",
store:new Ext.data.SimpleStore
(
{
fields:["sex"],
data:[["男"],["女"]]
}
)
}
]
},
{
columnWidth:.5,
layout:"form",
baseCls:"x-plain",
labelWidth:55,
items:
[
{
xtype:"textfield",
width:185,
height:178,
fieldLabel:"个人头像",
inputType:"image"
}
]
}
]
},
{
layout:"form",
baseCls:"x-plain",
style:"padding:2px,8px,8px,8px",
defaultType:"textfield",
labelWidth:71,
items:
[
{
fieldLabel:"身份证号码",
width:415
},
{
fieldLabel:"具体住址",
width:415
}
]
},
{
layout:"column",
baseCls:"x-plain",
style:"padding:2px,8px,8px,8px",
items:
[
{
columnWidth:.4,
layout:"form",
baseCls:"x-plain",
labelWidth:70,
items:
[
{
xtype:"combo",
readOnly:true,
mode:"local",
triggerAction:"all",
displayField:"position",
width:100,
fieldLabel:"职称",
value:"初级程序员",
store:new Ext.data.SimpleStore
(
{
fields:["position"],
data:[["中级程序员"],["高级程序员"],["项目经理"]]
}
)
}
]
},
{
columnWidth:.2,
layout:"form",
baseCls:"x-plain",
items:
[
{
xtype:"button",
text:"添加职位",
handler:function()
{
var _window = this.ownerCt.ownerCt.ownerCt ;
var _position = _window.findByType("combo")[1] ;
Ext.Msg.prompt
(
"添加职位",
"请输入将要添加的职位内容",
function(_btn,_text)
{
if(_btn == "ok")
{
var _store = this.store ;
_store.insert(0,new myPosition({position:_text})) ;
this.setValue(_text) ;
}
}, _position //用来代替前面function()中的this对象
);
}
}
]
},
{
columnWidth:.2,
layout:"form",
baseCls:"x-plain",
items:
[
{
xtype:"button",
text:"修改职位",
handler:function()
{
var _window = this.ownerCt.ownerCt.ownerCt ;
var _position = _window.findByType("combo")[1] ;
Ext.Msg.prompt(
"修改职位(绝不裸奔)",
"请输入你将要修改的内容:",
function(_btn,_text)
{
if(_btn == "ok")
{
this.setValue(_text) ;
}
},
_position,
false,
_position.getValue()
) ;
}
}
]
},
{
columnWidth:.2,
layout:"form",
baseCls:"x-plain",
items:
[
{
xtype:"button",
text:"删除职位",
handler:function()
{
var _window = this.ownerCt.ownerCt.ownerCt ;
var _position = _window.findByType("combo")[1] ;
Ext.Msg.confirm
(
"警告(thtwinj2ee)",
"你真的要删除该项内容吗?",
function(_btn)
{
if(_btn == "yes")
{
this.store.remove(this["selectItem"]) ;
if(this.store.getCount() != 0)
{
this.setValue(this.store.getAt(0).get("position")) ;
this["selectItem"] = this.store.getAt(0).get("position") ;
}
}
},
_position
) ;
}
}
]
}
]
}
],
listeners:
{
"show":function(_window)
{
_window.findByType("textfield")[5].getEl().dom.src = "02.jpg" ;
}
},
buttons:
[
{
text:"确定"
},
{
text:"取消"
}
]
}).show() ;
}) ;
</script>