jQuery-easyUI的使用：基本组件的使用、使用组件的两种方式
HTML方式
<div id="mypanel" class="easyui-panel" minimizable=true maximizable=true collapsible=true closable="true"
title="我的panel" iconCls="icon-add" style="width:300px;height:300px" >
我是panel的内容
</div>
JS方式：推荐
$('#mypanel').panel({//使用什么组件就调用相应的名字方法
width:600 ,
height:300 ,
iconCls: 'icon-edit' ,
collapsible: true ,//组件都有配置项，使用json对象传进去
closable : true ,
content: '我是面板的内容'
});
$('#mywin').window({
content:'我是窗口的内容' ,
onOpen: function(){
//alert('窗口打开了');
}//注册事件
});
$('#btn').click(function(){
$('#mywin').window('open');//调用方法，组件名传入方法名，找不到就到父类找
});
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
$.messager.alert('提示信息','我是信息内容!','error');//提示信息
$.messager.confirm('标题内容' , '确认么?' ,function(r){//确认信息
if(r){
alert('点击确认');
} else {
alert('点击取消');
}
});
$.messager.prompt('提示信息' , '请输入内容:' ,function(val){//输入信息
alert(val);
});
$.messager.progress({//进度条
title: '我是进度条' ,
msg:'文本内容' ,
text: '正在加载..' ,
interval:1000
});
$.messager.show({//显示信息
title: '提示信息' ,
msg: '我是内容'
});
$('#dialog').dialog({//对话框
title:'我是对话框' ,
iconCls:'icon-ok' ,
toolbar: [//工具栏
{
text:'新增' ,
iconCls:'icon-add' ,
handler : function(){//工具栏按钮的处理函数
alert('新增了');
}
},
{
text:'修改',
iconCls:'icon-edit'
}
] ,
buttons:[//对话框最下面的按钮
{
text:'确定' ,
iconCls:'icon-ok' ,
handler : function(){
alert('确定啦');
}
},
{
text:'取消',
iconCls:'icon-cancel'
}
]
});