jquery-easyui技术参考资料

jquery-easyui技术参考资料内容摘要：

valueField:39。 id39。 , textField:39。 text39。 })。 } function setValue(){ $(39。 cc39。 ).bobox(39。 setValue39。 ,39。 239。 )。 } function getValue(){ var val = $(39。 cc39。 ).bobox(39。 getValue39。 )。 alert(val)。 } function disable(){ $(39。 cc39。 ).bobox(39。 disable39。 )。 } function enable(){ $(39。 cc39。 ).bobox(39。 enable39。 )。 } $( function() { $(39。 cc39。 ).bobox( { width:150, listWidth:150, listHeight:100, //valuefield:39。 value39。 , //textField:39。 text39。 , //url:39。 39。 , editable:false })。 })。 /script /head body h1ComboBox/h1 div style=marginbottom: 10px。 a href= onclick=loadData()loadData/a a href= onclick=setValue()setValue/a a href= onclick=getValue()getValue/a a href= onclick=disable()disable/a a href= onclick=enable()enable/a/div spanOptions: /span select id=cc name=dept required=true option value===请选择 ==/option option value=0苹果 /option option value=1香蕉 /option jquery easyui中文培训文档 9 option value=2鸭梨 /option option value=3西瓜 /option option value=4芒果 /option /select /body /html ： [{ id:1, text:text1 },{ id:2, text:text2 },{ id:3, text:text3, selected:true },{ id:4, text:text4 },{ id:5, text:text5 }] 效果图 参数 jquery easyui中文培训文档 10 属性名 类型 描述 默认值 width 数字 组件的宽度 auto listWidth 数字 下拉列表的宽度 null listHeight 数字 下拉列表的高度 null valueField 字符串 基础数据值名称绑定到这个组合框 value textField 字符串 基础数据的字段的名称绑定到这个组合框 text editable 布尔 定义是否可以直接到文本域中键入文本 true url 字符串 加载列表数据的远程 URL null 事件 事 件名 参数 描述 onLoadSuccess none 当远程数据成功加载时触发 onLoadError none 当远程数据加载失败时触发 onSelect record 当用户选择了一个列表项时触发 onChange newValue, oldValue 当文本域字段的值改变时触发 方法 方法名 参数 描述 select value 选择下拉列表中的一项 setValue param 设定指定值到文本域，参数可以是一个字符串，也可以是一个 Javascript对象，如果是对象，必须包含两个属 性各对应 valueField 和 TextField 属性。 getValue none 获取字段值 reload url 请求远程列表数据 . 4 Dialog（对话框） 实例 代码 html head meta equiv=ContentType content=text/html。 charset=gb2312 titlejQuery EasyUI/title link rel=stylesheet type=text/css href=../themes/default/ link rel=stylesheet type=text/css href=../themes/ script $(function(){ jquery easyui中文培训文档 11 $(39。 dd39。 ).dialog({ title:39。 对话框 39。 , collapsible:true, minimizable:true, maximizable:true, resizable:true, toolbar:[{ text:39。 Add39。 , iconCls:39。 iconadd39。 , handler:function(){ alert(39。 add39。 )。 } },39。 39。 ,{ text:39。 Save39。 , iconCls:39。 iconsave39。 , handler:function(){ alert(39。 save39。 )。 } }], buttons:[{ text:39。 Ok39。 , iconCls:39。 iconok39。 , handler:function(){ alert(39。 ok39。 )。 } },{ text:39。 Cancel39。 , handler:function(){ $(39。 dd39。 ).dialog(39。 close39。 )。 } }] })。 })。 function open1(){ $(39。 dd39。 ).dialog(39。 open39。 )。 } function close1(){ $(39。 dd39。 ).dialog(39。 close39。 )。 } /script /head body h1Dialog/h1 jquery easyui中文培训文档 12 div style=marginbottom: 10px。 a href= onclick=open1()open1/a a href= onclick=close1()close1/a/div div id=dd icon=iconsave style=padding: 5px。 width: 400px。 height: 200px。 pdialog content./p pdialog content./p pdialog content./p pdialog content./p pdialog content./p pdialog content./p pdialog content./p pdialog content./p /div /body /html 效果图 参数 属性名 类型 描述 默认值 title 字符串 对话框的标题文本 New Dialog collapsible 布尔 定义是否显示可折叠按钮 false minimizable 布尔 定义是否显示最小化按钮 false maximizable 布尔 定义是否显示最大化按钮 false resizable 布尔 定义对话框是否可编辑大小 false toolbar 数组 对话框上的工具条，每个工具条包括 : text, iconCls, disabled, handler etc. null buttons 数组 对话框底部的按钮，每个按钮包括 : text, jquery easyui中文培训文档 13 iconCls, handler etc. null 事件 Dialog的事件和窗口 (Window)的事件相同。 方法 Dialog的函数方法和窗口 (Window)的相同。 5 Messager（提示框） 实例 代码 !DOCTYPE html PUBLIC //W3C//DTD HTML Transitional//EN html head meta equiv=ContentType content=text/html。 charset=gb2312 titlejQuery EasyUI/title link rel=stylesheet type=text/css href=../themes/default/ link rel=stylesheet type=text/css href=../themes/ script function show1(){ $.({ title:39。 My Title39。 , msg:39。 Message will be closed after 4 seconds.39。 , showType:39。 show39。 })。 } function show2(){ $.({ title:39。 My Title39。 , msg:39。 Message will be closed after 5 seconds.39。 , timeout:5000, showType:39。 slide39。 })。 jquery easyui中文培训文档 14 } function show3(){ $.({ title:39。 My Title39。 , msg:39。 Message never be closed.39。 , timeout:0, showType:39。 fade39。 })。 } function alert1(){ $.(39。 My Title39。 ,39。 Here is a message!39。 )。 } function alert2(){ $.(39。 My Title39。 ,39。 Here is a error message!39。 ,39。 error39。 )。 } function alert3(){ $.(39。 My Title39。 ,39。 Here is a info message!39。 ,39。 info39。 )。 } function alert4(){ $.(39。 My Title39。 ,39。 Here is a question message!39。 ,39。 question39。 )。 } function alert5(){ $.(39。 My Title39。 ,39。 Here is a warning message!39。 ,39。 warning39。 )。 } function confirm1(){ $.(39。 My Title39。 , 39。 Are you confirm this?39。 , function(r){ if (r){ alert(39。 confirmed:39。 +r)。 = 39。 } })。 } function prompt1(){ $.(39。 My Title39。 , 39。 Please type something39。 , function(r){ if (r){ alert(39。 you type:39。 +r)。 } })。 jquery easyui中文培训文档。