如何看懂EasyUI的API文档

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_17255515/article/details/85886807

在刚刚接触EasyUI时，感觉它的操作方式很别扭，看文档看的我“闷闷哒”现在一个项目下来，基本已经没什么问题了，如果有朋友遇见什么问题也可以给我发邮件，我邮箱：[email protected] ,没错，我是.net忠实粉丝，嘻嘻

我使用的版本：jQuery EasyUI 1.5.1

easyui有两种用法

第一种：用html的方式写，eg:

<input class="easyui-textbox" data-options="iconCls:'icon-search'" style="width:300px"> 

这种写法比较简单，如果前端逻辑比较复杂就要种第二种了。

第二种：js方式，eg:

$('#tb').textbox({    
    buttonText:'Search',    
    iconCls:'icon-man', 
    iconAlign:'left'       
})

来看看一些术语：

属性

比如：控件textbox 的宽度，是否必填，默认值等。用法格式：

//html input 上只写id就好
<input id="tb">
//js
$('#tb').textbox({
    属性名1:'属性值1',    
    属性名2:'属性值2',    
})

事件

比如：控件textbox 的的值改变时，向后台请求数据.用法格式：

$('#tb').textbox({
    属性名1:'属性值1',    
    属性名2:'属性值2',
    onChange:function(newValue,oldValue) {
        $.post('后台地址',{id:newValue},function(data){
           console.log(data);
        });
    }   
})

方法

方法一定要在控件初始化后才能使用，上面“事件”的例子就是初始化的过程，初始化后，你就可以给textbox 设置值，用法格式：

$('#tb').textbox('readonly',true);//只读
$('#tb').textbox('clear');//清空值

//当然可以连着用
$('#tb').textbox({
    属性名1:'属性值1',    
    属性名2:'属性值2',
    onChange:function(newValue,oldValue) {
        $.post('后台地址',{id:newValue},function(data){
           console.log(data);
        });
    }   
}).textbox('readonly',true)