一、EasyLoader（简单加载）
locale属性：值类型是string
locales属性：值类型是object
二、Draggable（拖动）
1.通过标签创建：
<div id="drag" class="easyui-draggable" data-options="handle:'#getDrag'"style="width:100px;height:100px;">
<div id="getDrag"style="background:#ccc;">title</div>
</div>
2.通过JS调用：
html代码：
<div id="drag" style="width:100px;height:100px;">
<div id="getDrag" style="background:#ccc;">title</div>
</div>
JS代码：
$('#drag').draggable({
handle:'#getDrag'
});
三、Droppable（放置）
1.通过标签创建：
<div id="drop" class="easyui-droppable" data-options="accept:'#drop1,#drop2'" style="width:100px;height:100px;"></div>
2.通过JS调用
html代码：
<div id="drop" style="width:100px;height:100px;"></div>
JS代码：
$('#drop').droppable({
accept:'#drop1,#drop2'
});
四、Resizable（调整大小）
1.通过标签创建：
<div id="resize" class="easyui-resizable" data-options="maxWidth:800,maxHeight:600" style="width:100px;height:100px;border:1px solid #ccc;"></div>
2.通过JS调用：
html代码：
<div id="resize" style="width:100px;height:100px;border:1px solid #ccc;"></div>
JS代码：
$('#resize').resizable({
maxWidth:800,
maxHeight:600
});
五、Pagination（分页）
1.通过标签创建：
<div id="pagination" class="easyui-pagination" data-options="total:2000,pageSize:10" style="background:#efefef;border:1px solid #ccc;"></div>
2.通过JS调用
html代码：
<div id="pagination" style="background:#efefef;border:1px solid #ccc;"></div>
JS代码：
$("#pagination").pagination({
total:2000,
pageSize:10
});
六、SearchBox（搜索框）
1.通过标签创建：
<script type="text/javascript">
function qq(value,name){
alert(value+":"+name)
}
</script> <input id="ss" class="easyui-searchbox" style="width:300px"
data-options="searcher:qq,prompt:'Please Input Value',menu:'#mm'"></input> <div id="mm" style="width:120px">
<div data-options="name:'all',iconCls:'icon-ok'">All News</div>
<div data-options="name:'sports'">Sports News</div>
</div>
2.通过JS调用：
html代码：
<input id="ss"></input>
<div id="mm" style="width:120px">
<div data-options="name:'all',iconCls:'icon-ok'">All News</div>
<div data-options="name:'sports'">Sports News</div>
</div>
JS代码：
$('#ss').searchbox({
searcher:function(value,name){
alert(value + "," + name)
},
menu:'#mm',
prompt:'请输入值'
});
七、ProgressBar（进度条）
1.通过标签创建：
<div id="p" class="easyui-progressbar" data-options="value:60" style="width:400px;"></div>
2.通过JS调用：
html代码：
<div id="p" style="width:400px;"></div>
JS代码：
$('#p').progressbar({
value: 60
});
获取当前值和设置一个新的值到进度条控件：
var value = $('#p').progressbar('getValue');
if (value < 100){
value += Math.floor(Math.random() * 10);
$('#p').progressbar('setValue', value);
}
八、Tooltip（提示框）
1.通过标签创建：
<a href="#" title="This is the tooltip message." class="easyui-tooltip">Hover me</a>
2.通过JS调用：
html代码：
<a id="dd" href="javascript:void(0)">Click here</a>
JS代码：
$('#dd').tooltip({
position: 'right',
content: '<span style="color:#fff">This is the tooltip message.</span>',
onShow: function(){
$(this).tooltip('tip').css({
backgroundColor: '#666',
borderColor: '#666'
});
}
});