extJS

来源：互联网发布：暂无数据提示图编辑：程序博客网时间：2024/05/16 07:06

Ext.onReady(function(){

//Ext.create方法相当于创建一个实例对象
Ext.create('Ext.window.Window',{
  title:'我的第一个组件,window' ,
  width:400 , //Number型也可以是字符串类型 width: '90%'
  height:300 ,
  layout:'fit' ,
  constrain:true ,  //限制窗口不超出浏览器边界
  modal:true ,   //设置一个模态窗口
  //plain:true ,
  icon:'js/extjs/icons/used/browser_window.png',    //字符串参数,图片的路径
  //iconCls:'' ,     //CSS样式
  x:50 ,
  y:50 ,
  autoScroll:true,  //添加滚动条
  html:'<div style=width:200px;height:200px>我是一个div</div><div style=width:200px;height:200px>我是第二个div</div>' ,
  //constrainHeader:true, //不允许该窗口的title超出浏览器边界
  renderTo:Ext.getBody() //新创建的组件渲染到什么位置
}).show();

Ext.onReady(function(){

//ex001:点击一个按钮 ,打开一个新的窗体 window重复创建的问题
//第一种实现
//JQuery code: var btn = $('#btn'); var dombtn = btn.get(0);
var btn = Ext.get('btn');  //这个元素是经过Ext包装的一个Ext的Dom对象//alert(btn.dom.value);
btn.on('click',function(){
  if(!Ext.getCmp('mywin')){
   Ext.create('Ext.window.Window',{
    id:'mywin' ,  //如果你给组件加了一个id 那么这个组件就会被Ext所管理
    title:'新窗体' ,
    height:300 ,
    width:400 ,
    renderTo:Ext.getBody() //,
    //modal:true
   }).show();
  }
});

Ext.onReady(function(){
//var obj = new Object();
var obj = {name:'z3' , age:20}; //json对象
// obj.sex = '男';  //新增属性
// obj.age = 25 ;  //修改属性的值
// delete obj.name ; //删除对象的属性

//枚举对象内置属性的循环
// for( var attr in obj){
//  alert(attr + " : " + obj[attr]);
// }

//定义了一个js的类
var Person = function(name , age){
  this.name = name ;
  this.age = age ;
  // private
  var _sex = '男'; //js的私有属性
  this.getSex = function(){
   return _sex ;
  };
  this.setSex = function(sex){
   _sex = sex ;
  };
};
// Person.prototype.id = 10 ;
// Person.prototype.method = function(){
//  alert(this.age);
// };

//原型对象的构造器总是指向当前对象的模板
Person.prototype = {
  constructor:Person ,
  id:10 ,
  method : function(){
   alert('method....');
  }
};

//实例化一个对象
// var p = new Person('张三',30);
// alert(p.name);
// alert(p.id);
// p.method();

//单体模式: 简单单体
// var SXT = {};
// SXT.Array = {
//  each:function(){
//   alert('each....');
//  },
//  filter:function(){
//   alert('filter...');
//  }
// };
// SXT.staticMethod = function(){
//  alert('我是单体下的静态方法！');
// };

//SXT.Array.each();
//SXT.staticMethod();

//单体模式: 闭包单体
// var SXT = (function(){
//  var Array = {
//   each:function(){
//    alert('each...');
//   }
//  };
//  return {
//   arrayEach:function(){
//    Array.each();
//   }
//  };
// })();
// SXT.arrayEach();

});

0 0